tooltipOptions + example (#295)

Author: zafrirron

README.md

@@ -88,6 +88,7 @@ Optional properties for **msg.payload** include
  - **popup** : html to fill the popup if you don't want the automatic default of the properties list. Using this overrides photourl, videourl and weblink options.
  - **label** : displays the contents as a permanent label next to the marker, or
  - **tooltip** : displays the contents when you hover over the marker. (Mutually exclusive with label. Label has priority)
+ - **tooltipOptions** : custom tooltip/label options  (offset, direction, permanent, sticky, interactive, opacity, className) )
  - **contextmenu** : an html fragment to display on right click of marker - defaults to delete marker. You can specify `${name}` to substitute in the name of the marker. Set to `""` to disable just this instance.
 
 Any other `msg.payload` properties will be added to the icon popup text box. This can be

examples/Custom Tooltip.json

@@ -0,0 +1,83 @@
+[
+    {
+        "id": "ec9da974.051b48",
+        "type": "inject",
+        "z": "f6f2187d.f17ca8",
+        "name": "",
+        "repeat": "",
+        "crontab": "",
+        "once": false,
+        "topic": "",
+        "payload": "",
+        "payloadType": "str",
+        "x": 1010,
+        "y": 560,
+        "wires": [
+            [
+                "f77a7ed4.f955d"
+            ]
+        ]
+    },
+    {
+        "id": "f77a7ed4.f955d",
+        "type": "function",
+        "z": "f6f2187d.f17ca8",
+        "name": "Car + Label",
+        "func": "var thing = {\n    name:\"Jason Isaacs\", \n    lat:51, \n    lon:-1.45,\n    icon:\"car\",\n    iconColor:\"darkred\",\n    extrainfo:\"Hello to Jason Isaacs\",\n    label:\"This is a custom label\",\n    tooltipOptions: {\"offset\" : [-100,-100], \"permanent\" : true, \"opacity\" : 1, \"direction\" : \"top\", \"className\" : \"tooltip\"}\n};\nmsg.payload = thing;\nreturn msg;",
+        "outputs": 1,
+        "timeout": "",
+        "noerr": 0,
+        "initialize": "",
+        "finalize": "",
+        "libs": [],
+        "x": 1230,
+        "y": 560,
+        "wires": [
+            [
+                "f83930ff.b21488"
+            ]
+        ]
+    },
+    {
+        "id": "cd09f7be.079518",
+        "type": "comment",
+        "z": "f6f2187d.f17ca8",
+        "name": "Simple map - click inject to send info to map.",
+        "info": "Adds a map at http://(your-server-ip):1880/worldmap. \n\nThe `function` node creates an object with some basic properties required to add to a map.",
+        "x": 1170,
+        "y": 500,
+        "wires": []
+    },
+    {
+        "id": "f83930ff.b21488",
+        "type": "worldmap",
+        "z": "f6f2187d.f17ca8",
+        "name": "",
+        "lat": "",
+        "lon": "",
+        "zoom": "",
+        "layer": "OSMG",
+        "cluster": "",
+        "maxage": "",
+        "usermenu": "show",
+        "layers": "show",
+        "panit": "false",
+        "panlock": "false",
+        "zoomlock": "false",
+        "hiderightclick": "false",
+        "coords": "none",
+        "showgrid": "false",
+        "showruler": "true",
+        "allowFileDrop": "false",
+        "path": "/worldmap",
+        "overlist": "DR,CO,RA,DN,HM",
+        "maplist": "OSMG,OSMC,EsriC,EsriS,EsriT,EsriO,EsriDG,NatGeo,UKOS,OpTop",
+        "mapname": "",
+        "mapurl": "",
+        "mapopt": "",
+        "mapwms": false,
+        "x": 1400,
+        "y": 560,
+        "wires": []
+    }
+]

worldmap/worldmap.js

@@ -2289,18 +2289,18 @@ function setMarker(data) {
     // If .label then use that rather than name tooltip
     if (data.label) {
         if (typeof data.label === "boolean" && data.label === true) {
-            marker.bindTooltip(data["name"], { permanent:true, direction:"right", offset:labelOffset });
+            marker.bindTooltip(data["name"], data.tooltipOptions || { permanent:true, direction:"right", offset:labelOffset });
         }
         else if (typeof data.label === "string" && data.label.length > 0) {
-            marker.bindTooltip(data.label, { permanent:true, direction:"right", offset:labelOffset });
+            marker.bindTooltip(data.label, data.tooltipOptions || { permanent:true, direction:"right", offset:labelOffset });
         }
         delete marker.options.title;
         delete data.label;
     }
     // otherwise check for .tooltip then use that rather than name tooltip
     else if (data.tooltip) {
         if (typeof data.tooltip === "string" && data.tooltip.length > 0) {
-            marker.bindTooltip(data.tooltip, { direction:"bottom", offset:[0,4] });
+            marker.bindTooltip(data.tooltip, data.tooltipOptions || { direction:"bottom", offset:[0,4] });
             delete marker.options.title;
             delete data.tooltip;
         }