[World Map] How to show markers using latitude and longitude

[World Map] How to show markers using latitude and longitude

  
Forge Component
(4)
Published on 2015-07-30 by Gonçalo Borrêga
4 votes
Published on 2015-07-30 by Gonçalo Borrêga

Hello guys,

I'm having some trouble understanding how to show the markers in the world map using latitude and longitude. How can i add markers and which fields need to be filled (e.g., HasMarker in the Map_CountryInfo entity)?


Thank you!
Rafael Valente 

Hi Rafael,

I was just looking into the implementation and it seems the parameter "Map_ExtraMarkers" on the WorldMiller maps, which would allow you to add markers at specific latitudes/longitudes, is not implemented yet. It is just ignored...

I'll try to clean it up and/or implement it in another block. Do you need custom labels/markers for the countries? or just looking to display markers over the basic jVectorMap?

Hi Rafael,

Attached is an updated version of the component which is already taking into consideration the Extra Markers list...

I add to change the parameters for some of the public blocks, which forces the refresh of the component, so not updating it immediately in the Forge right now. Let us know if that helps, and if stable... and I'll update it by then. 

The Example screen in the module (Entry point is called GDP) shows how to add a custom list of extra markers...

Enjoy

Hi Gonçalo!


First of all, let me just thank you for your replies.

To give you a context, i'm developing a project where i track the positioning of some satellites. I have to work my raw data before i can display their position and to do this i will have the satellites latitude and longitude. This is why i created this discussion. 

Will the updates suit my purpose?

P.S.: I will try the new changes and give you feedback.


Thank you,

Rafael Valente

Hi Rafael,

Yep, that's what I added. You can provide a list of (extra) Map_Markers with latitude and longitude.

I didn't drill down into what would be the way to change it from a "point" to an image (e.g. a satellite icon). From jVectorMap that is possible, but I won't have the time to change it in the next few days, specially in a generic fashion, as I believe it needs some local resources). Advise you to try it and then check jVectorMap's documentation if you want to have the icons displayed.

Goncalo Borrega wrote:

Hi Rafael,

Yep, that's what I added. You can provide a list of (extra) Map_Markers with latitude and longitude.

I didn't drill down into what would be the way to change it from a "point" to an image (e.g. a satellite icon). From jVectorMap that is possible, but I won't have the time to change it in the next few days, specially in a generic fashion, as I believe it needs some local resources). Advise you to try it and then check jVectorMap's documentation if you want to have the icons displayed.

Gonçalo, thank you a lot for your efforts. I will try the .oml in the weekend and give feedback.


Best regards,

Rafael Valente


@Gonçalo,


The code works like a charm. As you can see in the image below, i already have one marker inserted in the world map. I tried one thing and it didn't workout. In the image, you are able to see the label i created for my marker. I wanted to put the "Satellite ID", "Latitude" and " Longitude" in different lines, but when i used the NewLine() function inside the expression to define the Label of my marker, the World Map wasn't rendered. Do you think this is a fixable bug or am i doing something wrong?


Thank you for your support!

Rafael Valente 

Hi Rafael,

Seems that's currently not supported in the block implementation.

You could try to do the following:

  1. Change the javascript of the component, replacing the "onMarkerTipShow" implementation (attached image to show where you can find it) with the following code:
    1.  onMarkerTipShow: function(e, el, code){
              var label = markerLabels[selectedKey][el.html()];
              if(typeof label == 'undefined') {
                  el.html(el.text());
              } else {
                  el.html(label);
              }
          }
  2. Instead of using NewLine()s on the marker label, use a snippet of HTML instead. E.g.:     
    1. Satellite ID:<strong>Teste</strong><br>Latitude:...