Google map multiple markers works on test and not on Android

[Takis]

Hi

I followed the tutorial
http://devcenter.appery.io/tutorials/...

and while in test all work fine, in Samsung Galaxy S4, when I click "Place marker" it does not update the map. When I click on show directions it works.

Can you help?
Thanks.

[Evgene Karachevtsev]

Hello Panagiotis,

Could you please provide us with public link to your project and steps to reproduce the issue?

[Takis]

The issue does not happen at the test console.
Only when you install it on my Samsung Galaxy S4 Android 4.4.2

The strange thing is that the direction from to works fine and markers are displayed.

The script that I run when clicking on a button is
code
var locations = [];

var values = $('[name="ResultsText5"]').map(function(index,element){
if ($(element).text().trim().length > 0) {
return $(element).text();
}
}).get().join('@');
locations = values.split("@");

for (var i=0;i<locations&#46;length;i++)
{
Srv_convert_address&#46;execute({
'data' : {
'address' : locations,
'sensor' : false
}
});
}
/code

Are all OK?
Should I do any kind of map refresh?

Thanks!

[Yurii Orishchuk]

Hi Panagiotis,

I see in this code some if statement with "return".

So this code could stop without any notification.

Please add before code:

pre

Srv_convert_address&#46;execute(

/pre

Following code:

pre

alert("run convert addres");
Srv_convert_address&#46;execute(

/pre

Also please use WEINRE debugger to see errors in the app in device:

See details: http://devcenter.appery.io/documentat...

Regards.

[Takis]

Hi Yurii

I put some alerts as you said
code
for (var i=0;i<locations&#46;length;i++)
{
alert("run convert addres"); <---------------
alert(locations);<---------------
Srv_convert_address&#46;execute({
'data' : {
'address' : locations,
'sensor' : false
}
});
}
/code
Even on mobile these alerts appear correctly.
So whatever happens,happens inside the Srv_convert_address.execute.
My locations may be "Leoforos Mesogeion 201 Athens Greece" and not just "Paris" like the example.
May this long address be an issue? (in test console works ...)

Thanks

[Takis]

On Srv_convert_address service this code is executed on success

code
var markerLatLng = new google&#46;maps&#46;LatLng(localStorage&#46;getItem('markerLat'), localStorage&#46;getItem('markerLng'));

var marker = new google&#46;maps&#46;Marker({
position: markerLatLng,
map: map,
title: data&#46;results[0]&#46;address_components[0]&#46;long_name,
animation: google&#46;maps&#46;Animation&#46;DROP
});

bounds&#46;extend(markerLatLng);
map&#46;fitBounds(bounds);
/code

[Takis]

I also created a more simple test case.
One input field, one button.
on button click
code
var locations1 = [];
locations1 = Apperyio('marker_location')&#46;val()&#46;split(",");
alert (locations1);

for (var i=0;i<locations1&#46;length;i++)
{
Srv_convert_address&#46;execute({
'data' : {
'address' : locations1,
'sensor' : false
}
});
}
/code

I put in input "Paris", alert fires fine but map is not updated.

[Takis]

Solved

I changed the target SDK version to 4.1.x from 4.2.x.
I have Galaxy S4 with 4.4.2

Why it did not work for target 4.2.x?
Will 4.4.x be supported, as I do not see it in the list of target SDK?

Thanks.

[Takis]

Can I have a sample code so I can put markers in google_map, with title, description and small photo, but just using Lat and Lng values?

How can I clear all markers before showing on map, the new set of markers?

Thanks!

[Yurii Orishchuk]

Hi Panagiotis,

Glad you solved it..

1 That's not good way to show it all. More preferable is to use infowindow on marker click with information you need.

Here is an example how to use it:

pre

Code: Select all

 //Were "multiGoogleMap" is map component name. 
 var map = Appery("multiGoogleMap").options.mapElement.gmap('get', 'map'); 

&#47;&#47;Create infowindow&#46;
var infowindow = new google&#46;maps&#46;InfoWindow({
content: 'test content',
maxWidth: 320
});

Code: Select all

 var CreateMarker = function(data){ 
     var marker = new google.maps.Marker({ 
         position: new google.maps.LatLng(data.lat, data.long), 
         map: map, 
         draggable: true, 

         title: data.location 
     }); 

     //Add event handler and open infoWindow 
     google.maps.event.addListener(marker, 'click', function() { 
         //Set content for infowindow. 
         infowindow.setContent('Content of + ' + data.location + ''); 

         //Open infowindow. 
         infowindow.open(map, marker); 
     }); 
 }; 

 for (var i = 0; i < locationHelper&#46;aLocations&#46;length; i++) 
     &#47;&#47;In this function you should to pass latitude, longitude and text to display in infowindow&#46; 
     CreateMarker({lat: locationHelper&#46;aLocations[i][0], long: locationHelper&#46;aLocations[i][1], location:  locationHelper&#46;aLocations[i][2]}); 

/pre

2 Unfortunatly there is no way to clear all overlays without handle them.

But when you have this items (which you want to remove from map) you can remove them with ".setMap(null);" method.

See details details about implementation:
http://stackoverflow.com/questions/15...

So with this implementation when you add marker you need invoke:

pre

markersArray&#46;push(marker);

/pre

And when you need remove all markers you can run following JS:

pre

clearOverlays();

/pre

Regards.