diff --git a/CHANGELOG.md b/CHANGELOG.md
index 117936a..bebf3bb 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,6 @@
### Change Log for Node-RED Worldmap
+ - v2.0.3-beta - Let circles have popups. Better drawing of ellipses
- v2.0.2-beta - Let lines and areas also have popups
- v2.0.1-beta - Add optional graticule.
- v2.0.0-beta - Move to leaflet 1.4.x plus all plugins updated
diff --git a/README.md b/README.md
index cd0751f..345e46e 100644
--- a/README.md
+++ b/README.md
@@ -9,6 +9,7 @@ map web page for plotting "things" on.
### Updates
+- v2.0.3-beta - Let circles have popups. Better drawing of ellipses
- v2.0.2-beta - Let lines and areas also have popups
- v2.0.1-beta - Add optional graticule
- v2.0.0-beta - Move to leaflet 1.4.x plus all plugins updated
@@ -200,7 +201,7 @@ then rather than draw a point and icon it draws the polygon. Likewise if it cont
- **clickable** : boolean - set to true to allow click to show popup.
- **popup** : html string to display in popup (as well as name).
-### Circles
+### Circles and Ellipses
If the msg.payload contains a **radius** property, as well as name, lat and lon, then rather
than draw a point it will draw a circle. The *radius* property is specified in meters.
@@ -209,8 +210,11 @@ than draw a point it will draw a circle. The *radius* property is specified in m
As per Areas and Lines you may also specify *color*, *fillColor*, and *layer*.
-If the payload contains a **sdlat** and **sdlon** property instead of *radius* an ellipse will be drawn. The sdlat and sdlon propertys specify the semi-axes of the ellipse.
-These are specified in the Latitude/Longitude format.
+If the **radius** property is an array of two numbers, these specify the minor and major radii
+of an ellipse, in meters. A **tilt** property can also be applied to rotate the ellipse by
+a number of degrees.
+
+ msg.payload = { "name":"Bristol Channel", "lat":51.5, "lon":-2.9, "radius":[30000,70000], "tilt":45 };
### Options
@@ -224,7 +228,7 @@ Areas, Lines and Circles can also specify more optional properties:
- fillOpacity
- dashArray
- clickable - if true sets the passed in name as popup
- - popup - extra html string to display as part of popup
+ - popup - extra html string to display inside the popup
## Drawing
diff --git a/package.json b/package.json
index 1aa255b..5d2f947 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "node-red-contrib-web-worldmap",
- "version": "2.0.2-beta",
+ "version": "2.0.3-beta",
"description": "A Node-RED node to provide a web page of a world map for plotting things on.",
"dependencies": {
"cgi": "0.3.1",
diff --git a/worldmap/index.html b/worldmap/index.html
index 9f99127..1fb5891 100644
--- a/worldmap/index.html
+++ b/worldmap/index.html
@@ -1035,7 +1035,7 @@ function setMarker(data) {
if (!data.hasOwnProperty("weight")) { opt.weight = 3; } //Standard settings different for lines
if (!data.hasOwnProperty("opacity")) { opt.opacity = 0.8; }
var polyln = L.polyline(data.line, opt);
- if (opt.clickable) {
+ if (opt.clickable) {
var words = ""+data.name+"";
if (data.popup) { var words = words + "
" + data.popup; }
polyln.bindPopup(words, {autoClose:false, closeButton:true, closeOnClick:false, minWidth:200});
@@ -1060,13 +1060,10 @@ function setMarker(data) {
if (!data.hasOwnProperty("fillColor")) { opt.fillColor = "blue"; }
delete opt.clickable;
var ellipse = L.ellipse(new L.LatLng((data.lat*1), (data.lon*1)), [200000*data.sdlon*Math.cos(data.lat*Math.PI/180), 200000*data.sdlat], 0, opt);
- if (data.clickable != false) {
- ellipse.on('click', function(e) {
- var popup = L.popup()
- .setLatLng(new L.LatLng((data.lat*1), (data.lon*1)))
- .setContent('
'+data.name+'
lat : '+data.lat+'
lon : '+data.lon+'