Search Results

Search found 15 results on 1 pages for 'markerclusterer'.

Page 1/1 | 1 

  • Google Map + MarkerClusterer only takes place when map completely zooms out

    - by user415795
    The clustering works but somehow it only takes place at the maximum zoom out(the largest view with all nations), the moment I zoom in by 1 value, the clustering icon changes back to markers. I try with all kinds of values on the maxZoom and gridSize clusterer options with no help. Can someone please kindly advice. Thanks. <script language="javascript" type="text/javascript"> var markersArray = []; var mc = null; var markersArray = []; var mc = null; var map; var mapOptions; var geocoder; var infoWindow; var http_request = false; var lat = 0; var lng = 0; var startingZoom = 7; var lowestZoom = 1; // The lower the number, the more places can be seen on within the bounds. var highestZoom = 8; function mapLoad() { geocoder = new google.maps.Geocoder(); infoWindow = new google.maps.InfoWindow(); mapOptions = { zoomControl: true, zoom: 2, minZoom: lowestZoom, maxzoom: highestZoom, draggable: true, scrollwheel: true, disableDoubleClickZoom: true, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById('map'), mapOptions); } $(document).ready(function () { var searchUrl; var locations; // Place the user's current location marker on the map var Location = new google.maps.LatLng(1.340319, 103.743744); var Location2 = new google.maps.LatLng(1.322347, 103.757881); createMarker('1', Location, 'My Location', '', '', '', '/Images/home.png'); createMarker('1', Location2, 'My Location', '', '', '', '/Images/bb.png'); var bounds = new google.maps.LatLngBounds(); bounds.extend(gameLocation); map.fitBounds(bounds); }); // Create the marker with address information function createMarker(actId, point, address1, address2, town, postcode, icon) { var marker = new google.maps.Marker({ map: map, icon: icon, position: point, title: address1, animation: google.maps.Animation.DROP }); marker.metadata = { id: actId }; markersArray.push(marker); mc = new MarkerClusterer(map, markersArray); return marker; } </script>

    Read the article

  • infoWindow on MarkerClusterer in google maps

    - by vishwanath
    I need infoWindow to be opened instead of zooming in map, when clicking on the ClusterMarker. I am using Gmaps util library MarkerClusterer for creating cluster of markers. I tried changing following line in markerclusterer.js ClusterMarker_.prototype = new GOverlay(); with ClusterMarker_.prototype = new GMarker(); so that I can get the openInfoWindow() function in the clustermarker, but that didnt worked out. Got some error. If possible, Please suggest solution so that this can be done with MarkerClusterer. Or else any other library which will be able to do this. Any help will be appreciated.

    Read the article

  • infoWindow on MarkerClusterer

    - by vishwanath
    I need infoWindow to be opened instead of zooming in map, when clicking on the ClusterMarker. I am using Gmaps util library MarkerClusterer for creating cluster of markers. I tried changing following line in markerclusterer.js ClusterMarker_.prototype = new GOverlay(); with ClusterMarker_.prototype = new GMarker(); so that I can get the openInfoWindow() function in the clustermarker, but that didnt worked out. Got some error. If possible, Please suggest solution so that this can be done with MarkerClusterer. Or else any other library which will be able to do this. Any help will be appreciated.

    Read the article

  • problem in markerclusterer.js

    - by user308604
    hi guys, i have an problem and error when include markerclusterer.js in my code.. when i run the program, the error below shown: Microsoft JScript runtime error: 'GOverlay' is undefined the error code is ClusterMarker_.prototype = new GOverlay(); it is happen on markerclusterer.js... please help me if u know the solution...

    Read the article

  • problem in markerclusterer.js (urgent!!!!!!)

    - by user308604
    hi guys, i have an problem and error when include markerclusterer.js in my code.. when i run the program, the error below shown: Microsoft JScript runtime error: 'GOverlay' is undefined the error code is ClusterMarker_.prototype = new GOverlay(); it is happen on markerclusterer.js... please help me if u know the solution...because it is important to me and i need the solution as fast as possible..

    Read the article

  • Google map API v3 event click raise when clickingMarkerClusterer?

    - by lucian.jp
    I have a Google Map API v3 map object on a page that uses MarkerClusterer. I have a function that need to run when we click on the map to it is registered as: google.maps.event.addListener(map, 'click', function (event) { CallMe(event.latLng); }); So my problem is as follows: When I click on a cluster of MarkerClusterer instead of behaving like a marker and not raise the click event on the map but only the one from the marker it calls the click from the map. To test this I have generated an alert from the markerclusterer click: google.maps.event.addListener(markerClusterer, "clusterclick", function (cluster) { alert('MarkerClusterer click event'); }); So the clusterclick rises after the click event of map object. I then can't remove the listener of map object as a solution. Is there any way to test if there was a clusterer click in the click event of the map? Or a way to replicate the marker behaviour and do not raise the click event of map when clustererclick is called? Google and documentation didn’t help me. Thx

    Read the article

  • Adding simple marker clusterer to google map

    - by take2
    Hi, I'm having problems with adding marker clusterer functionality to my map. What I want is to use custom icon for my markers and every marker has its own info window which I want to be able to edit. I did accomplish that, but now I have problems adding marker clusterer library functionality. I read something about adding markers to array, but I'm not sure what would it exactly mean. Besides, all of the examples with array I have found, don't have info windows and searching through the code I didn't find appropriate way to add them. Here is my code (mostly from Geocodezip.com): <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer.js"></script> <style type="text/css"> html, body { height: 100%; } </style> <script type="text/javascript"> //<![CDATA[ var map = null; function initialize() { var myOptions = { zoom: 8, center: new google.maps.LatLng(43.907787,-79.359741), mapTypeControl: true, mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}, navigationControl: true, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); var mcOptions = {gridSize: 50, maxZoom: 15}; var mc = new MarkerClusterer(map, [], mcOptions); google.maps.event.addListener(map, 'click', function() { infowindow.close(); }); // Add markers to the map // Set up three markers with info windows var point = new google.maps.LatLng(43.65654,-79.90138); var marker1 = createMarker(point,'Abc'); var point = new google.maps.LatLng(43.91892,-78.89231); var marker2 = createMarker(point,'Abc'); var point = new google.maps.LatLng(43.82589,-79.10040); var marker3 = createMarker(point,'Abc'); var markerArray = new Array(marker1, marker2, marker3); mc.addMarkers(markerArray, true); } var infowindow = new google.maps.InfoWindow( { size: new google.maps.Size(150,50) }); function createMarker(latlng, html) { var image = '/321.png'; var contentString = html; var marker = new google.maps.Marker({ position: latlng, map: map, icon: image, zIndex: Math.round(latlng.lat()*-100000)<<5 }); google.maps.event.addListener(marker, 'click', function() { infowindow.setContent(contentString); infowindow.open(map,marker); }); } //]]> </script>

    Read the article

  • What is the optimum way to select the most dissimilar individuals from a population?

    - by Aaron D
    I have tried to use k-means clustering to select the most diverse markers in my population, for example, if we want to select 100 lines I cluster the whole population to 100 clusters then select the closest marker to the centroid from each cluster. The problem with my solution is it takes too much time (probably my function needs optimization), especially when the number of markers exceeds 100000. So, I will appreciate it so much if anyone can show me a new way to select markers that maximize diversity in my population and/or help me optimize my function to make it work faster. Thank you # example: library(BLR) data(wheat) dim(X) mdf<-mostdiff(t(X), 100,1,nstart=1000) Here is the mostdiff function that i used: mostdiff <- function(markers, nClust, nMrkPerClust, nstart=1000) { transposedMarkers <- as.array(markers) mrkClust <- kmeans(transposedMarkers, nClust, nstart=nstart) save(mrkClust, file="markerCluster.Rdata") # within clusters, pick the markers that are closest to the cluster centroid # turn the vector of which markers belong to which clusters into a list nClust long # each element of the list is a vector of the markers in that cluster clustersToList <- function(nClust, clusters) { vecOfCluster <- function(whichClust, clusters) { return(which(whichClust == clusters)) } return(apply(as.array(1:nClust), 1, vecOfCluster, clusters)) } pickCloseToCenter <- function(vecOfCluster, whichClust, transposedMarkers, centers, pickHowMany) { clustSize <- length(vecOfCluster) # if there are fewer than three markers, the center is equally distant from all so don't bother if (clustSize < 3) return(vecOfCluster[1:min(pickHowMany, clustSize)]) # figure out the distance (squared) between each marker in the cluster and the cluster center distToCenter <- function(marker, center){ diff <- center - marker return(sum(diff*diff)) } dists <- apply(transposedMarkers[vecOfCluster,], 1, distToCenter, center=centers[whichClust,]) return(vecOfCluster[order(dists)[1:min(pickHowMany, clustSize)]]) } }

    Read the article

  • Custom Icon for Marker Clusterer

    - by Nyxynyx
    I am using Marker Clusterer library for Google Maps API V3. Now that I have the clusterer working, I want to change the default icon to a custom one. Prorblem: When I try to set the style property of the marker clusterer, the default icon still appears. Where did I go wrong? JS Code // Marker Clusterer var styles = {styles: [{ height: 53, url: "http://localhost/mywebsite/images/template/markers/cluster.png", width: 53 }, { height: 56, url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m2.png", width: 56 }, { height: 66, url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m3.png", width: 66 }, { height: 78, url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m4.png", width: 78 }, { height: 90, url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m5.png", width: 90 }]}; var mcOptions = {gridSize: 50, maxZoom: 15, styles: styles[styles]}; mc = new MarkerClusterer(map, [], mcOptions);

    Read the article

  • Google maps cluster manager

    - by Prashant
    Hello all I am using google maps in my application. I have to show 100 markers on map. First I prepared a markers array from these markers. When markers are added using addOverlay from markers array, it takes some time and they are being added in some animated way (in sequence). I want all of them to get added to map in a single shot, so no flickering effect. I tried MarkerClusterer but it shows a cluster of markers where the need be. Instead I want all the markers to appear, not a cluster. Only they should be added faster. var point = new GLatLng(latArr[i],lonArr[i]); var marker = new GMarker(point,markerOptions); markers[i] = marker; var markerCluster = new MarkerClusterer(map, markers); Any suggestions please? Thank you.

    Read the article

  • Google Maps: remember id of marker with open info window

    - by AP257
    I have a Google map that is showing a number of markers. When the user moves the map, the markers are redrawn for the new boundaries, using the code below: GEvent.addListener(map, "moveend", function() { var newBounds = map.getBounds(); for(var i = 0; i < places_json.places.length ; i++) { // if marker is within the new bounds then do... var latlng = new GLatLng(places_json.places[i].lat, places_json.places[i].lon); var html = "blah"; var marker = createMarker(latlng, html); map.addOverlay(marker); } }); My question is simple. If the user has clicked on a marker so that it is showing an open info window, currently when the boundaries are redrawn the info window is closed, because the marker is added again from scratch. How can I prevent this? It is not ideal, because often the boundaries are redrawn when the user clicks on a marker and the map moves to display the info window - so the info window appears and then disappears again :) I guess there are a couple of possible ways: remember which marker has an open info window, and open it again when the markers are redrawn don't actually re-add the marker with an open info window, just leave it there However, both require the marker with an open window to have some kind of ID number, and I don't know that this is actually the case in the Google Maps API. Anyone? ----------UPDATE------------------ I've tried doing it by loading the markers into an initial array, as suggested. This loads OK, but the page crashes after the map is dragged. <script type="text/javascript" src="{{ MEDIA_URL }}js/markerclusterer.js"></script> <script type='text/javascript'> function createMarker(point,html, hideMarker) { //alert('createMarker'); var icon = new GIcon(G_DEFAULT_ICON); icon.image = "http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=FFFFFF,008CFF,000000&ext=.png"; var tmpMarker = new GMarker(point, {icon: icon, hide: hideMarker}); GEvent.addListener(tmpMarker, "click", function() { tmpMarker.openInfoWindowHtml(html); }); return tmpMarker; } var map = new GMap2(document.getElementById("map_canvas")); map.addControl(new GSmallMapControl()); var mapLatLng = new GLatLng({{ place.lat }}, {{ place.lon }}); map.setCenter(mapLatLng, 12); map.addOverlay(new GMarker(mapLatLng)); // load initial markers from json array var markers = []; var initialBounds = map.getBounds(); for(var i = 0; i < places_json.places.length ; i++) { var latlng = new GLatLng(places_json.places[i].lat, places_json.places[i].lon); var html = "<strong><a href='/place/" + places_json.places[i].placesidx + "/" + places_json.places[i].area + "'>" + places_json.places[i].area + "</a></strong><br/>" + places_json.places[i].county; var hideMarker = true; if((initialBounds.getSouthWest().lat() < places_json.places[i].lat) && (places_json.places[i].lat < initialBounds.getNorthEast().lat()) && (initialBounds.getSouthWest().lng() < places_json.places[i].lon) && (places_json.places[i].lon < initialBounds.getNorthEast().lng()) && (places_json.places[i].placesidx != {{ place.placesidx }})) { hideMarker = false; } var marker = createMarker(latlng, html, hideMarker); markers.push(marker); } var markerCluster = new MarkerClusterer(map, markers, {maxZoom: 11}); </script>

    Read the article

  • Google Maps API v3... non-mobile?

    - by andrhamm
    I'm trying to make a Google Maps widget for my website but all of the examples are for full-screen mobile devices. The tutorials work when I copy paste them exactly as shown but they don't seem to work when I want them to only occupy a portion of the page. From what I've read, the v3 is the best API yet (for what I need) because of its speed and compatibility with mobile devices. I plan to make a widget very similar to the MarkerClusterer example from the demo gallery but I can't get it working. Is this a common issue? I know I'm being vague but I would appreciate some help. Thanks

    Read the article

  • JavaScript: supposed to execute functions sequentially, not actually doing so?

    - by AP257
    I'm seeing a lot of answers on StackOverflow that say that JavaScript executes code sequentially, but I can actually see my own JavaScript not doing so. From the following code: function centre_map(lat, lng, zoom_level) { alert('centre_map'); map = new GMap2(document.getElementById('map_canvas')); var latlng = new GLatLng(lat, lng); map.setCenter(latlng, zoom_level); } function add_markers_within_bounds() { alert('add_markers_within_bounds'); // add numerous BLUE markers within map bounds using MarkerClusterer } function add_marker(lat, lng, place_name, grid, county) { alert('add_marker'); // add one ordinary RED Google Maps marker } centre_map('{{lat}}', '{{lng}}', 12); add_markers_within_bounds('{{grid}}', '{{place_name}}'); add_marker('{{lat}}', '{{lng}}', '{{place_name}}', '{{grid}}', '{{county}}'); I get the following sequence of events: 'centre_map' alert 'add_markers_within_bounds' alert 'add_marker' alert individual RED marker appears on map (i.e. add_marker renders) multiple BLUE markers appear on map (i.e. add_markers_within_bounds renders) Why doesn't add_markers_within_bounds complete before add_marker gets under way: and how can I make it do so? I know that one way might be to call add_marker from within add_markers_within_bounds, but for various reasons I'd rather keep it as a separate function.

    Read the article

  • jQuery async ajax query and returning value problem (scope, closure)

    - by glebovgin
    Hi. Code not working because of async query and variable scope problem. I can't understand how to solve this. Change to $.ajax method with async:false - not an option. I know about closures, but how I can implement it here - don't know. I've seen all topics here about closures in js and jQuery async problems - but still nothing. Help, please. Here is the code: var map = null; var marker; var cluster = null; function refreshMap() { var markers = []; var markerImage = new google.maps.MarkerImage('/images/image-1_32_t.png', new google.maps.Size(32, 32)); $.get('/get_users.php',{},function(data){ if(data.status == 'error') return false; var users = data.users; // here users.length = 1 - this is ok; for(var i in users) { //here I have every values from users - ok var latLng = new google.maps.LatLng(users[i].lat, users[i].lng); var mark = new google.maps.Marker({ position: latLng, icon: markerImage }); markers.push(mark); alert(markers.length); // length 1 } },'json'); alert(markers.length); // length 0 //if I have alert() above - I get result cluster = new MarkerClusterer(map, markers, { maxZoom: null, gridSize: null }); } Thanks.

    Read the article

  • Need guidance on a Google Map application that has to show 250 000 polylines.

    - by lucian.jp
    I am looking for advice for an application I am developing that uses Google Map. Summary: A user has a list of criteria for searching a street segment that fulfills the criteria. The street segments will be colored with 3 colors for showing those below average, average and over average. Then the user clicks on the street segment to see an information window showing the properties of that specific segment hiding those not selected until he/she closes the window and other polyline becomes visible again. This looks quite like the Monopoly City Streets game Hasbro made some month ago the difference being I do not use Flash, I can’t use Open Street Map because it doesn’t list street segment (if it does the IDs won’t be the same anyway) and I do not have to show Google sketch building over. Information: I have a database of street segments with IDs, polyline points and centroid. The database has 6,000,000 street segment records in it. To narrow the generated data a bit we focus on city. The largest city we must show has 250,000 street segments. This means 250,000 line segment polyline to show. Our longest polyline uses 9600 characters which is stored in two 8000 varchar columns in SQL Server 2008. We need to use the API v3 because it is faster than the API v2 and the application will be ported to iPhone. For now it's an ASP.NET 3.5 with SQl Server 2008 application. Performance is a priority. Problems: Most of the demo projects that do this are made with API v2. So besides tutorial on the Google API v3 reference page I have nothing to compare performance or technology use to achieve my goal. There is no available .NET wrapper for the API v3 yet. Generating a 250,000 line segment polyline creates a heavy file which takes time to transfer and parse. (I have found a demo of one polyline of 390,000 points. I think the encoder would be far less efficient with more polylines with less points since there will be less rounding.) Since streets segments are shown based on criteria, polylines must be dynamically created and cache can't be used. Some thoughts: KML/KMZ: Pros: Since it is a standard we can easily load Bing maps, Yahoo! maps, Google maps, Google Earth, with the same KML file. The data generation would be the same. Cons: LineString in KML cannot be encoded polyline like the Google map API can handle. So it would probably be bigger and slower to display. Zipping the file at the size it will take more processing time and require the client side to uncompress the data and I am not quite sure with 250,000 data how an iPhone would handle this and how a server would handle 40 users browsing at the same time. JavaScript file: Pros: JavaScript file can have encoded polyline and would significantly reduce the file to transfer. Cons: Have to create my own stripped version of API v3 to add overlays, create polyline, etc. It is more complex than just create a KML file and point to the source. GeoRSS: This option isn't adapted for my needs I think, but I could be wrong. MapServer: I saw some post suggesting using MapServer to generate overlays. Not quite sure for the connection with our database and the performance it would give. Plus it requires a plugin for generating KML. It seems to me that it wouldn't allow me to do better than creating my own KML or JavaScript file. Maintenance would be simpler without. Monopoly City Streets: The game is now over, but for those who know what I am talking about Monopoly City Streets was showing at max zoom level only the streets that the centroid was inside the Bounds of the window. Moving the map was sending request to the server for the new streets to show. While I think this was ingenious, I have no idea how to implement something similar. The only thing I thought about was to compare if the long was inside the bound of map area X and same with Y. While this could improve performance significantly at high zoom level, this would give nothing when showing a whole city. Clustering: While cluster is awesome for marker, it seems we cannot cluster polylines. I would have liked something like MarkerClusterer for polylines and be able to cluster by my 3 polyline colors. This will probably stay as a “would have been freaking awesome but forget it”. Arrow: I will have in a future version to show a direction for the polyline and will have to show an arrow at the centroid. Loading an image or marker will only double my data so creating a custom overlay will probably be my only option. I have found that demo for something similar I would like to achieve. Unfortunately, the demo is very slow, but I only wish to show 1 arrow per polyline and not multiple like the demo. This functionality will depend on the format of data since I don't think KML support custom overlays. Criteria: While the application is done with ASP.NET 3.5, the port to the iPhone won't use the web to show the application and be limited in screen size for selecting the criteria. This is why I was more orienting on a service or page generating the file based on criteria passed in parameters. The service would than generate the file I need to display the polylines on the map. I could also create an aspx page that does this. The aspx page is more documented than the service way. There should be a reason. Questions: Should I create a web service to returns the street segments file or create an aspx page that return the file? Should I create a JavaScript file with encoded polyline or a KML with longitude/latitude based on the fact that maximum longitude/latitude polyline have 9600 characters and I have to render maximum 250,000 line segment polyline. Or should I go with a MapServer that generate the overlay? Will I be able to display simple arrow on the polyline on the next version. In case of KML generation is it faster to create the file with XDocument, XmlDocument, XmlWriter and this manually or just serialize the street segment in the stream? This is more a brainstorming Stack Overflow question than an actual code problem. Any answer helping narrow the possibilities is as good as someone having all the knowledge to point me out a better choice.

    Read the article

1