Javascript Public Methods

You are here:

The plugin provides some Javascript methods and events available publicly to be used in your custom code, if needed.

Most likely you will need the Map ID in your code. You can find the map ID for each one in the administration archive for the maps you created. Most methods will be accessible through the iMapsManager object.

Events

When the map is loaded it triggers the ‘maploaded‘ event in the map container. You can use code like this to listen to it:

// replace with your map ID.
let mapID = 21148;
let mapContainer = document.getElementById('map_' + mapID);
mapContainer.addEventListener('mapready',function(ev){
// map is loaded. your code here
});

You can use the above code to run code only after the map has loaded.


Methods

Select

Triggering a select event on a region will simulate a click on it. So if you have events attached to those regions, they will be executed.

NameDescriptionExamples
iMapsManager.select( MapID, Region(s) );Triggers select event on selected entries.

Parameters:
MapID = int or string – ID of the Map
Region(s) = string with one or more region codes divided by commas.
iMapsManager.select(325,'US-CA');
iMapsManager.select(325,'US-CA,US-AZ')
iMapsManager.clearSelected( MapID );Clears all hovered entries in selected map.

Parameters:
MapID = int or string – ID of the Map
iMapsManager.clearSelected( 325 );
iMapsManager.getSelected( MapID );Gets the list of currently hovered entries.

Parameters:
MapID = int or string – ID of the Map

Returns an array.
iMapsManager.getSelected( 325 );

When selecting other entry, the map will automatically clear previously selected entries.


Hover

Triggering the hover event will usually change the region or marker colour and show the tooltip. You can trigger the hover event in multiple regions, but it will probably only display the tooltip in the first or last. If you have events in the map attached to the hover event, they will also be triggered.

NameDescriptionExamples
iMapsManager.hover( MapID, Region(s) );Triggers hover event on selected entries.

Parameters:
MapID = int or string – ID of the Map
Region(s) = string with one or more region or marker codes divided by commas.
iMapsManager.hover(325,'US-CA');
iMapsManager.hover(325,'US-CA,US-AZ')
iMapsManager.clearHovered( MapID );Clears all hovered entries in selected map.

Parameters:
MapID = int or string – ID of the Map
iMapsManager.clearHovered( 325 );
iMapsManager.getHovered( MapID );Gets the list of currently hovered entries.

Parameters:
MapID = int or string – ID of the Map

Returns an array.
iMapsManager.getHovered( 325 );

When using the hover event in your own custom elements, it would be important to also use the clearHovered method when hovering out your custom elements, so that it doesn’t stay with that state.


Highlight

The highlight event is similar to the hover event, but it will not trigger the tooltip or any other associated event with that region or marker. It will simply change the region or marker colour.

NameDescriptionExamples
iMapsManager.highlight( MapID, Region(s) );Changes the colour of the selected region or marker.

Parameters:
MapID = int or string – ID of the Map
Region(s) = string with one or more region or marker codes divided by commas.
iMapsManager.highlight(325,'US-CA');
iMapsManager.highlight(325,'US-CA,US-AZ')
iMapsManager.clearHighlighted( MapID );Clears all highlighted entries from the map.

Parameters:
MapID = int or string – ID of the Map
iMapsManager.clearHighlighted( 325 );
iMapsManager.getHighlighted( MapID );Gets the list of currently highlighted entries.

Parameters:
MapID = int or string – ID of the Map

Returns an array.
iMapsManager.getHighlighted( 325 );

When using the highlight event in your own custom elements, it would be important to also use the clearHighlighted method when hovering out your custom elements, so that it doesn’t stay with that state.

Posted by Carlos Moreira

Lead developer of Interactive Geo Maps plugin.