Worldmap - show Text an arrow for radius

[steinerma]

hi, i use "node-red-contrib-web-worldmap". I have already implemented the circle.
-> Is it possible to show the radius (blue arrow and text) on the dashboard here?
-> If drawing the radius would not be possible, is it possible to show a simple text out- or inside the circle?
Pop-up is unfortunately not an option, because it could hide important POI's.
Thanks a lot for your help!

[hotNipi]

You can draw a line but no options for arrow and no options to have text near that line.

[steinerma]

thank you very much for your answer. Would it be possible to display a pop-up window 15m displaced from the center of the circle?
--> the way I have the function node, the pop-up is displayed in the center of the circle. I would have to add 15m to the variables of the coordinates (15m = radius). Do you have an approach for this?

[{"id":"5b0891c0.27faa","type":"function","z":"2280caa4.5bb226","name":"Popup Ereignisort","func":"var lat = flow.get(\"lat\");\nvar lon = flow.get(\"lon\");\nvar thing = {\n    lat: lat, \n    lon: lon, \n    name:\"Ereignisort\",\n    popup:'Radius roter Kreis = 15m',\n    popped:true,\n    extrainfo:\"Kreis Ereignisort\",\n    layer:\"Pop-up Ereignisort\"\n    \n};\nmsg.payload = thing;\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":1050,"y":2200,"wires":[["352a0280.0f4bae"]]}]

[dceejay]

maybe you can add the popup to the line ?

[hotNipi]

node.send(
    {payload:{ 
        "name":"one", 
        "icon":"podcast",
        "lat":58.37225,
        "lon":26.683333,
        "popup":'<span>This way it overrides all from marker default popup</span>'
       
    }
})
node.send(
    {payload:{ 
        "name":"two", 
        "icon":"podcast",
        "lat":58.372478,
        "lon":26.683345,
        "custom":'This text will be added to marker default popup'
    }
})

Edit: clarified popup and custom property behavior

[steinerma]

thank you both for your inputs! I can now display the radius thanks to you. For the text I use the popup, which I show or hide (depending on the zoom level). This solution is a good workaround.

Here is the function node for displaying the radius:

var lat = flow.get("lat");
var lon = flow.get("lon");
var thing = {
    name: "point", 
    lat: lat, 
    lon: lon, 
    bearing: 50,
    length: 30,
};
msg.payload = thing;
return msg;