Tell us what you are trying to do?
I know this is a feature that's available with the google maps api, but curious how I can implement using the text of a custom field to display instead just a simple map marker. For example, I've provided an image from a website where the price of the listing is displayed as the map marker and I would like to achieve something similar.
Thanks!
I know this is a feature that's available with the google maps api, but curious how I can implement using the text of a custom field to display instead just a simple map marker.
You can use a custom image as the map marker's background, but there's not a built-in way to display dynamic text on the marker itself. Like standard markers on Google Maps, Toolset's markers are designed to display information in a standard popup/InfoWindow after a click event.
We have documentation available for customizing the marker image / icon: https://toolset.com/documentation/user-guides/maps/display-on-google-maps/displaying-markers-on-google-maps/#marker-icon
...and documentation for more options for the marker shortcode:
https://toolset.com/documentation/user-guides/maps/maps-shortcodes/#wpv-map-marker
You can see there is a title option, but that doesn't appear until you hover your mouse over the marker or one of the "focus on marker" links, if you set it up as such.
If you want to try manipulating map markers using the Google Maps JS API, you can see an example showing how to access a Map object here:
https://toolset.com/documentation/user-guides/maps/programmatically-change-map-settings/
I added a small change to the example code showing how to access an array of Marker objects:
// Listen to js_event_wpv_addon_maps_init_map_completed
$( document ).on('js_event_wpv_addon_maps_init_map_completed', function( event, event_settings ) {
var markers = WPViews.view_addon_maps.markers;
// Now you have access to a multidimensional array of Marker objects in the variable "markers".
} );
Here is a link to some documentation for the Google Maps JS API for drawing on the map:
https://developers.google.com/maps/documentation/javascript/overlays
That's about all I can offer, since this is custom code that falls outside the realm of our support forums. Let me know if you have questions about that.
