Never managed to get this map to work, I keep getting the following:

"An internal error occurred and was logged.
Please try again later or contact the administration team.

Sorry for any inconvenience.

Press here to continue"

No idea what can be causing it as I've tried to tweak everything and it only happens in pages where I try to add the map.

Have you checked if the error log, in Service Center, has more detail about this error?

João Pedro Abreu wrote:  I honestly have no idea how to access the service center.
 

It's the cog icon highlighted in the screenshot below:

João Pedro Abreu wrote:  

Thanks!

It says this:
"You need to define an API Key on the 'APIKey' site property of the GoogleMaps module" Can't find where I can insert the API key though.
 

Hey there, Renato,

If you already have an API key, you can access the Google_Maps module page, under "eSpaces", and select the "Site properties" tab:

The "BrowserAPIKey" is the one you're looking for (there's a typo on the error message I'm afraid).

Could you please try setting it there and tell us how it went?

Hey Carlos,

I also live same issue.
I can not understand your solving method completely.
May you clarify to say about detail of your method

Regards,

Thanks! Managed to fix it. One more question, I wanted the user to insert his address and the map will update/move to his adress (already done), however I wanted to list under the map the company's agents within a 10km radius of his location, I have marked all the agents in the map, is there a way to only list the ones which are within a 10km radius?

Hmm, as I recall that from my college days, Renato, there's a formula to calculate the distance between two degree unit points.

BUT you can't insert that into an aggregate, as far as I know, because there are no trigonometric functions. You can check if your case allows for an approximation and, if so, you can add an attribute to your aggregate and sort by it.

Ekincam: can you be a bit more specific on what is blocking you?

Thanks!

Also one last thing, I tried using your function to show a box with information once you click on a marker however nothing is happening.

Example:
Triggering: "click"

Handler: 

"function() {
    var contentString = 
    '<h3 style='margin:0'>Jeronimo XXXXXX</h3><br>
    <strong>Phone: </strong>212XXXXXXX<br>
    <br>
    <strong>Morada:</strong><br>
    R Santiago XXXXXXXXX<br>
    Corroios, 28XX-6XX<br>
    Portugal';

    var infowindow = new google.maps.InfoWindow({
          content: contentString
      });

    // Access this gMarker's map, set the center
    // to its position and zoom
    this.getMap().setCenter(this.getPosition());
    this.getMap().setZoom(8);    
    infowindow.open(this.getMap(), this);
}"

From the looks of it, you might be defining an anonymous JS function, but not calling/setting it anywhere.

Is that the case?

Carlos Filipe Simões wrote:  Wouldn't the JS function be called by the marker when I bind it to the marker in the "MarkerId" property?
 

Yes it would: if I recall correctly, you can add on click marker event handlers, either by using the component's blocks or actions. You should specify the correct event, followed by the JavaScript body.

Hmm, could you share you action flow with us? Or maybe the oml with the issue, so we can have a look?

If that's not acceptable, is there a JavaScript error we can use as starting point?

Carlos Filipe Simões wrote:  http://i.imgur.com/lgXHUZS.png

This is all I have related to the google maps, disregard "procurar" and procurar2 + OnNotify & refreshAgentes, they're not related.

As you can see the triggering is click and it has the function in the handler and it's also binded to 1 of the 3 markers yet when I publish & try to click in it on the map it doesn't do anything, no errors no nothing.
 

Ok...from the contents of that eSpace, I'd say you can't share a public URL so I can have look. But I think I found out the problem...would you mind tweaking the above code to:

"function() {
    var contentString = 
    '<h3 style=\'margin:0\'>Jeronimo XXXXXX</h3><br>'+
    '<strong>Phone: </strong>212XXXXXXX<br>'+
    '<br>'+
    '<strong>Morada:</strong><br>'+
    'R Santiago XXXXXXXXX<br>'+
    'Corroios, 28XX-6XX<br>'+
    'Portugal';

    var infowindow = new google.maps.InfoWindow({
          content: contentString
      });

    // Access this gMarker's map, set the center
    // to its position and zoom
    this.getMap().setCenter(this.getPosition());
    this.getMap().setZoom(8);    
    infowindow.open(this.getMap(), this);
}"

For some reason, the code is silently failing whenever we have multi-line strings, resulting in no JavaScript errors or even server-side calls. I guess it is somehow related to JavaScript not supporting multi-lined strings. I'd recommend using the 'string concatenation' method, since having the newlines there doesn't have any advantage.

Additionally, you need to escape your apostrophes (" ' ") inside the 'contentString' variable or ou'll be producing an invalid string literal.

Also: when you run into these types of problems, debugging the JavaScript source of the component could help (it's 'Map.js' file, inside one of the 'Google_Maps' source folder). Here's a small video of me on a test page, triggering the 'addMarkerEvent' function and breakpointing my way to completion.