Enable Directions on a Google Map on a Dynamic Page

I delete all the code and leave only the code for maps, it no longer gives an error in the console, you can see that it does not behave as expected, by the way, leave the address by default and send it to the wix offices. Can you please give us a hand with this topic?

please…

check again please…

[u]https://lotengomobile.wixsite.com/website-3/empresas-servicios/LOS-HIJOS-DE-SHIRLEY[/u]

I see the problem now. I suspect that the map is not ready when the dataset is and is therefore not being initiallized correctly. The map did work (for me) on your original page since it had more time to initialize.

I am sending this on to QA for evaluation.

We can dynamically show the location but, when we are going to use maps to create the route, it sends us to the wix offices, hopefully it will be resolved soon because we are not complete without this function. Will there be the possibility of modifying the static address, with code to make it work?

@yisrael-wix The issue is with dynamic pages

These 2 functions display successfully the geolocation of the business that is stored in a database.

It works perfectly with no problems, using Wix - Google map provided in the Wix editor. Now, this Wix - Google map comes with editor settings one of those settings is to turn on or turn off directions link if the directions link is turned on, we expect that if a user clicks the direction link the external map that opens on https://www.google.com/maps … on a new tab must show right away the direction from the user computer to the business.

But that’s not the case, the map shows only the direction from Wix (HQ) in California to the user. Since the map display right the location I’m pretty sure this is not an issue in the code but an internal issue in the way how Wix - Google map is working internally in the Wix platform

Thanks, we do appreciate any help because and I think this is in benefit for the Wix platform and Corvid.

I’m from a NodeJS / ReactJS background so I normally program with State and payload approach on Corvid, which works pretty well.

//State
let Data;

function retreiveDB(){
$w('#dynamicDataset').onReady(()=>{
    Data = $w('#dynamicDataset').getCurrentItem();
    Object.keys(Data).length > 0 ? gpsLocation() : '';
    });
}

function gpsLocation(){
    let location = {};
    let latitude = Data.latitude;
    let longitude = Data.longitude;
    location['latitude'] = latitude;
    location['longitude'] = longitude;
    location['description'] = Data.name;
    $w('#googleMap').location = location;
}

would there be any way to force the creation of the route through code?

while they fix it?

Unless you build your own API using Google maps API it won’t be possible. You will need to work with an HTML iframe to add the Google map, create the API using fetch to query the Google server and then posting data in the wixwindow so you can receive that data in the HTML code where you will have to add a script so you can work with raw JavaScript in it, and more importantly, you will need to get a Google map API key which cost extra money, that is by checking Google pricing.

I’ve done it before but in my case, my client is not having the budget for this implementation. The reason why I’m using the inbuilt tools from the Wix editor is to reduce code - time and stay on budget. Let me know if there is something else that I can help you with.

Hi,
Currently changing the value of the directions link of the google maps app is not available and setting the location doesn’t change it for the directions link.
You can submit you feedback as a feature request here .

@aleksf Yeah thats what I thought, tho would be something important to have in Corvid if you guys want to create a robust programming platform. Also since the directions link is a setting available in the editor it looks like it should work … so this is misleading …

noice thanks for sharing this …

Hello regarding this topic I have found an unorthodox solution but it works that can be implemented while wix solves.

I discovered that the trick is in the structure of the maps URL:

Google Maps

which should be “/dir” followed by for “//coordinates” latitude and longitude separated by a comma, if we put together the URL with that structure we can add the coordinates with a simple concatenation and a button “how to get?” that executes the function, i use a data set to get latitude and longitude, then maps takes care of the rest, In this way it is possible to create routes on dynamic pages with google maps, as wix would do without taking us to the wix offices.

I enclose a sample code I hope will be useful to you.

import wixData from 'wix-data';
import wixLocation from 'wix-location';

$w.onReady(function () {
//part 1 set the map location...
let currentItem = $w("#dynamicDataset").getCurrentItem();
$w("#googleMaps1").location = {
"latitude": currentItem.latitude, //latitude from database
"longitude": currentItem.longitude, //longitude from database
"description": currentItem.nameEnterprise, //ubication name from database
}
// part 2 event to open maps and show the route to location...
});
export function route_click(event) { // route button event
const lat = $w("#dynamicDataset").getCurrentItem().latitude; //latitude from database
const lon = $w("#dynamicDataset").getCurrentItem().longitude; //longitude from database
const coordenadas = lat + "," + lon; //coordinates
wixLocation.to("https://www.google.com/maps/dir//" + coordenadas); //final URL and routing to maps
}


Please coment, if you refine the code share…

(sorry for my bad english!)

Good to know this workaround, thanks for sharing it. I’d recommend you to create as first the location object before assigning it to the location property of the Google map. So is something like

location = {}
location.latitude = currentItem.latitude
location.longitude = currentItem.longitude
location.description = currentItem.nameEnterprise

Then once your new object is ready (the location object) assign it to the Google map property so is:

$w(“#googleMaps1”).location = location;

@dev thanks for correction.