Adding marker through a dynamically loading PHP file

[NickoLabs]

Greetings

I've been working around and about with Overviewer for the past 2-3 days. I haven't seen any quick API or javascript call to do so in the documentation.

I set up a Wordpress website and it is loading the basic map perfectly. The map has no default markers on it (except the spawn point).

What I want to do is that the Wordpress Loop to get the custom markers from a database and add those to the map, but I can't seem to add any markers via Javascript.

Is there a method to add markers directly to the map? Something like the leafletjs API ex: L.marker([lat,long]).bindPopup(description).addTo(maplayer);)?

Or even like Google Map? Ex: var marker = new google.maps.Marker({ position: myLatlng, map: map, title: 'Hello World!' });

Thanks for helping me out on this!

Regards, Nickolas Simard

[tswsl1989]

You might be able to use the google maps API like that, although you would need to convert chunk coordinates to lat/lon coordinates using overviewer.utils.fromWorldToLatLng() (See overviewer_core/data/js_src/util.js)

Alternatively you can have Overviewer add the extra markers as Manual POIs

[CounterPillow]

or alternatively alternatively, you can have Overviewer run genpoi with no markers but a marker group, and then have your script return its own markerDB.js.

[NickoLabs]

Is there a built in function to add markers directly to the map with the X and Z coordinates?

As for the Manual POIs, is that javascript? Where/when should I call those manual POIs? Note : I do not have the access to the rendered of overview, I only have the map to work with.

Example of my script:

<link rel="stylesheet" href="/overview/overviewer.css" type="text/css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false"></script>

<script type="text/javascript" src="/overview/underscore.js"></script>
<script type="text/javascript" src="/overview/backbone.js"></script>
<script type="text/javascript" src="/overview/overviewerConfig.js"></script>
<script type="text/javascript" src="/overview/overviewer.js"></script>
<div id="main_map" style="background-color: #172023;">
     <div id="NoJSWarning" style="color:white; background-color:black">
         If you can see this message, there is likely a problem loading the Overviewer javascript components.
         Check the javascript console for error messages.
     </div>
</div>

<script type="text/javascript">(function($){

// Custom POI generation HERE?

    overviewer.util.initialize();
})(jQuery)
</script>

Edit: Sorry, had to search on how to display code here :)

The genpoi... I suppose it's done server side? This is not something I have access to, sorry.

[NickoLabs]

Wrong button -_-

I tried using overviewer.utils.fromWorldToLatLng(), but I have to provide a model for it to work. At this point (see code with //Comment), I don't know, how I'm suppose to access the "model" for the function overviewer.utils.fromWorldToLatLng()?

[NickoLabs]

Still no replies?

I know I could add a Google Map marker somehow... Anyone have a working example of this? Thanks!

[eminence]

Hi there. I've not tested this, but the basic code should look something like this:

  var marker = new google.maps.Marker({
                            'position': overviewer.util.fromWorldToLatLng(entity.x,
                                entity.y, entity.z, overviewer.mapView.options.currentTileSet),
                            'map':      overviewer.map,
                            'title':    jQuery.trim(entity.hovertext), 
                            'content':  jQuery.trim(entity.text),
                            'icon':     iconURL,
                            'visible':  false
                    }); 

overviewer.util.createMarkerInfoWindow(marker);

entity should have .x, .y, and .z, which are the minecraft-world based coordinates of the thing you want to.

[CounterPillow]

Somewhat-related to #598 in that a well-defined API for adding markers should be looked into.