diff --git a/productMods/js/visualization/mapofscience/CustomMarker.js b/productMods/js/visualization/mapofscience/CustomMarker.js
index fa411e6e..785c9217 100644
--- a/productMods/js/visualization/mapofscience/CustomMarker.js
+++ b/productMods/js/visualization/mapofscience/CustomMarker.js
@@ -1,8 +1,8 @@
/* $This file is distributed under the terms of the license in /doc/license.txt$ */
-var ScinodePolygon = Polygon.extend({
+var ScinodePolygon = CirclePolygon.extend({
init: function(options) {
- options.polygon = createGoogleCirclePolygon(options);
this._super(options);
+ this.hide();
},
setValue: function(value) {
this.options.value = value;
@@ -11,11 +11,11 @@ var ScinodePolygon = Polygon.extend({
return this.options.value;
},
setSize: function(size) {
- this.polygon.setRadius(size);
+ this.setRadius(size);
this.setZIndex(-size);
},
focus: function() {
- this.setOptions({strokeWeight: 2.0});
+ this.setOptions({strokeWeight: 3.0});
},
unfocus: function() {
this.setOptions({strokeWeight: 1.0});
@@ -23,6 +23,7 @@ var ScinodePolygon = Polygon.extend({
registerEvents : function() {
var me = this;
var polygon = me.polygon;
+ this._super();
this.registerEvent(addClickListener(polygon, function() {
INFO_WINDOW.setPosition(this.center);
var content = '
' + this.label +'
' + this.value + ' publications
';
diff --git a/productMods/js/visualization/mapofscience/GMapAPI.js b/productMods/js/visualization/mapofscience/GMapAPI.js
index 98b23b5a..d81cf1df 100644
--- a/productMods/js/visualization/mapofscience/GMapAPI.js
+++ b/productMods/js/visualization/mapofscience/GMapAPI.js
@@ -25,6 +25,10 @@ function createGoogleCirclePolygon(options) {
return new GMAPS.Circle(options);
}
+function createGooglePolygon(options) {
+ return new GMAPS.Polygon(options);
+}
+
function createGoogleMarker(options) {
return new GMAPS.Marker(options);
}
@@ -36,6 +40,10 @@ function createInfoWindow(content, maxWidth) {
});
}
+function addMapProjectionChangedListener(map, actionFunction) {
+ return GEVENT.addListener(map, 'projection_changed', actionFunction);
+}
+
function addMouseOverListener(marker, actionFunction) {
return GEVENT.addListener(marker, 'mouseover', actionFunction);
}
diff --git a/productMods/js/visualization/mapofscience/Polygon.js b/productMods/js/visualization/mapofscience/Polygon.js
index d0c84e52..269e595c 100644
--- a/productMods/js/visualization/mapofscience/Polygon.js
+++ b/productMods/js/visualization/mapofscience/Polygon.js
@@ -7,9 +7,8 @@ var Polygon = Class.extend({
if (options.polygon) {
this.polygon = options.polygon;
} else {
- this.polygon = createGoogleCirclePolygon(options);
+ this.polygon = createGooglePolygon(options);
}
- this.hide();
this.registerEvents();
},
options : {
@@ -64,4 +63,77 @@ var Polygon = Class.extend({
});
this.handlers = null;
}
-});
\ No newline at end of file
+});
+
+var RADIAN_PER_DEGREE = Math.PI / 180;
+
+function degreeToRadians(degree) {
+ return degree * RADIAN_PER_DEGREE;
+}
+
+var CirclePolygon = Polygon.extend({
+ init : function(options) {
+ this.options = $.extend({}, this.options, options);
+ this._super(this.options);
+ },
+ options : {
+ radius: 0.0,
+ center: null
+ },
+ addToMap: function() {
+ if (!this.isPointsCreated()) {
+ this.initCirclePoints();
+ }
+ this._super();
+ },
+ show: function() {
+ if (!this.isPointsCreated()) {
+ this.initCirclePoints();
+ }
+
+ console.log(this.polygon.getPaths().getLength());
+ this._super();
+ },
+ isPointsCreated: function() {
+ return (this.polygon.getPath().getLength() > 1);
+ },
+ initCirclePoints: function() {
+ this.clearCirclePoints();
+ this.createCirclePoints();
+ },
+ createCirclePoints: function() {
+ var me = this;
+ var map = me.options.map;
+ var latLngArray = new google.maps.MVCArray(); // Circle's LatLngs
+ //console.log(map.getProjection());
+ if (map && map.getProjection()) {
+ var projection = map.getProjection();
+ var centerPoint = projection.fromLatLngToPoint(me.options.center);
+ var radius = me.options.radius;
+
+ // Create polygon points (extra point to close polygon)
+ for (var degree = 0; degree < 360; degree++) {
+ var radian = degreeToRadians(degree);
+ var x = centerPoint.x + (radius * Math.sin(radian));
+ var y = centerPoint.y + (radius * Math.cos(radian));
+ var point = new google.maps.Point(parseFloat(x), parseFloat(y));
+ latLngArray.push(projection.fromPointToLatLng(point));
+ }
+ }
+ me.polygon.setPath(latLngArray);
+ },
+ clearCirclePoints: function() {
+ this.polygon.getPath().clear();
+ },
+ setRadius: function(radius) {
+ this.polygon.radius = radius;
+ this.options.radius = radius;
+ this.initCirclePoints();
+ },
+ registerEvents: function() {
+ var me = this;
+ this.registerEvent(addMapProjectionChangedListener(me.options.map, function() {
+ me.initCirclePoints();
+ }));
+ }
+});
diff --git a/productMods/js/visualization/mapofscience/SizeCoding.js b/productMods/js/visualization/mapofscience/SizeCoding.js
index 83f79044..e8e1406f 100644
--- a/productMods/js/visualization/mapofscience/SizeCoding.js
+++ b/productMods/js/visualization/mapofscience/SizeCoding.js
@@ -56,8 +56,8 @@ var CircleSizeCoder = Class.extend({
this.options = $.extend({}, this.options, options);
},
options: {
- minRadius: 100000.0,
- maxRadius: 2500000.0,//2500000.0,
+ minRadius: 0.8,
+ maxRadius: 100.0,//100.0,
scaler: new Scaler({})
},
getSize: function(value) {