Vorbly <Code>
CODING MADE EASY WITH VORBLY
WIX CODE GOOGLE MAPS LOCATION FROM DATABASE
Need a Google Map for your dynamic pages? This tutorial will show you how to add a Google Map with geolocations from a database. We will provide you with the webpage elements and sample codes required to implement this feature.
THE DEMO
THE ELEMENTS
The Page
Google Maps: #googleMaps1
The Database
Create a database: GoogleMaps (dataset1)
Recommended fields:
-
Geolocation Latitude: latitude
-
Geolocation Longitude: longitude
-
Location Name / Description: location
Tip: You can use Google Maps or other online tools to find the latitude and longitude of addresses.
Create a dynamic page.
The Dynamic Page
Create a dyanmic page: Product (Title)
Link fields on dynamic page to your database. Do not link your Google Maps, geolocation will be populated by code.
THE CODE
Page Code
$w.onReady( function () {
$w("#dataset1").onReady( () => {
let currentItem = $w("#dataset1").getCurrentItem();
$w("#googleMaps1").location = {
"latitude": currentItem.latitude,
"longitude": currentItem.longitude,
"description": currentItem.location,
};
});
});
COMMENTS
I'm a paragraph. Click here to add your own text and edit me. It's easy.