Forum | Appery.io

Hi,

I'm trying to add multiple markers on a Gmap from a remote json, with no success.
What I did is to create the service to get the json data, to create the data source, to add the following javascript to the service success event :
var coordsArray = data.markers;
var marker;
for (var i = 0, j = coordsArray.length; i < j; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng( coordsArray.latitude, coordsArray.longitude ),
map: Appery("googlemap_2").gmap
});
}

and finally to invoke the service with button click event in the design section.

Could you please give me a hand with this problem ?

Thanks,
Marcel

Hi Marcel,

Here is an example of adding markers to map:
http://docs.appery.io/tutorials/addin...

Hi Katya,

Thanks for your reply. I have already looked at the link you mentioned but unfortunately it doesn't help me. (It reads the lat, long from the device and the markers details are hardcoded).

What I need, as mentioned before, is to read the markers' info from a json (REST) and display them on the Gmap.

The code I used is the one sent before.

Could you please have a look into it an give me a hand ?

Thanks,
Marcel

Hello Marcel,

It should help you:
pre
var coordsArray = data&#46;markers;
var marker;
var map = Apperyio("gmap");
$(coordsArray)&#46;each(function(){
var marker = new google&#46;maps&#46;Marker({
position: new google&#46;maps&#46;LatLng(this&#46;latitude, this&#46;longitude),
map: map
});
});

map&#46;refresh();
/pre

Hi Sergiy,

I added the following JS to the service success event:
var coordsArray = data.markers;
var marker;
var map = Apperyio("googlemap_2");
$(coordsArray).each(function(){
var marker = new google.maps.Marker({
position: new google.maps.LatLng(this.latitude, this.longitude),
map: map
});
});
map.refresh();

and I invoke the service at the mobilebutton_8 click.
Unfortunately it still doesn't work.

Marcel

I found out the problem.
Use:
var map = Apperyio("googlemap_2");
instead of:
var map = Apperyio("googlemap_2").get(0);

Sergiy, I didn't use ".get(0)" before. Anyway I tried in both ways and the behavior is the same. No marker shown.

Do you have any news on the above issue ?

Thanks,
Marcel

Hello Marcel!

Please post your public app link.

Hi Marcel,

Did you solve it?