Changeset 7733

Timestamp:

Apr 13, 2010, 2:07:42 PM (15 years ago)

Author:

janveeden

Message:

Mouseover function for clusternodes done. Gives titles(id's) of each node in the cluster for now.

Location:

trunk/src/map/inc

Files:

• markerClusterer.js (modified) (6 diffs)
• nodemapWL.js (modified) (3 diffs)

trunk/src/map/inc/markerClusterer.js

@@ -79 +79 @@
   var clusters_ = [];
   var map_ = map;
-  var maxZoom_ = null;
+  var maxZoom_ = 15;
   var me_ = this;
   var gridSize_ = 60;
@@ -554 +554 @@
       }
       if (clusterMarker_ === null) {
-        clusterMarker_ = new ClusterMarker_(center_, this.getTotalMarkers(), markerClusterer_.getStyles_(), markerClusterer_.getGridSize_());
+        clusterMarker_ = new ClusterMarker_(center_, this.getTotalMarkers(), markerClusterer_.getStyles_(), markerClusterer_.getGridSize_(), markers_);
         map_.addOverlay(clusterMarker_);
       } else {
@@ -605 +605 @@
  * @param {Number} padding Padding of marker center.
  */
-function ClusterMarker_(latlng, count, styles, padding) {
+function ClusterMarker_(latlng, count, styles, padding, markerArray) {
   var index = 0;
+  this.markerArray = markerArray;
   var dv = count;
   while (dv !== 0) {
@@ -636 +637 @@
 ClusterMarker_.prototype.initialize = function (map) {
   this.map_ = map;
+  var markerArray = this.markerArray;
   var div = document.createElement("div");
   var latlng = this.latlng_;
@@ -670 +672 @@
   map.getPane(G_MAP_MAP_PANE).appendChild(div);
   var padding = this.padding_;
-  GEvent.addDomListener(div, "click", function () {
+  GEvent.addDomListener(div, "doubleclick", function () {
     var pos = map.fromLatLngToDivPixel(latlng);
     var sw = new GPoint(pos.x - padding, pos.y + padding);
@@ -679 +681 @@
     map.setCenter(latlng, zoom);
   });
+  //Jan: We add our own mouseover listener for the cluster.
+  GEvent.addDomListener(div, "mouseover", function() {
+          mouseOverCluster(markerArray);
+      });
   this.div_ = div;
 };

trunk/src/map/inc/nodemapWL.js

@@ -33 +33 @@
         //This function adds a marker with an object from our 'marker'array defined in index.php
         function addMarker(current, i) {
-      var marker  = new GMarker(new GLatLng(current.latitude[0], current.longitude[0]));
+          var id = current.id;
+      var marker  = new GMarker(new GLatLng(current.latitude[0], current.longitude[0]), {title: id});
           //Added mouseover listener that calls on our mouseOver function when the mouse moves over a marker on the map
       GEvent.addListener(marker, 'mouseover', function() {
@@ -42 +43 @@
     }
         
-        //Our mouseover function
+        //Our mouseover function for single nodes. Gives the ID(our own given ID) and the name of the node.
         function mouseOver(id, name)
         {
@@ -49 +50 @@
                 obj.innerHTML = id+" - "+name;
                 //We will replace this function with a httprequest to a php file in the future
+                
+                
+                /*
+                *Hieronder verdergaan met dekking
+                */
+        }
+        
+        //Our mouseover function for Cluster nodes. 'markers' is an array containing all markers within the cluster
+        function mouseOverCluster(markers)
+        {
+                var markerTitles = new Array;
+                this.obj = document.getElementById("infotop");
+                for(var i=0; i<markers.length; i++) {
+                        markerTitles.push(markers[i].marker.getTitle()+"<br/>");
+                }
+                obj.innerHTML = markerTitles;
+                
+                /*
+                *Hieronder verdergaan met dekking
+                */
         }