Forum | Appery.io

I am doing an app where I have a map where are markers with locations of people stored in LocalStorage. I want to open a panel expanding user's description when "Details" button of marker's InfoWindow is clicked.

My problem is when I click "Details". The panel opens, but "Name" and "Description" shows always info of last person instead of person selected.

I'm convinced that I need to add something in eventAddListener of putPeopleInMap function, but I'm not sure how to do it.

MODEL:

• TPeople: Object{Name:String, Lat:String, Long:String, Description:String}

• TPeopleList: Array(TPeople)

  STORAGE:

• PeopleList: TPeopleList

• PersonSelected: TPeople

  ADD MARKERS FUNCTION (edited to add image better than text):
  

  e.g. I have PeopleList with this values:{[0]: {Name: Peter Pan, Lat: 55, Long: 40, Description: Hello, I'm Peter}, [1]: {Name:James Water, Lat: 88, Long: 52, Description: Hello, I'm James}, [2] {Name:John Cobra, Lat: 48, Long: 412, Description: Hello, I'm John}}. If I push in button of markers 0 and 1 (correctly positioned on the map) info shown is of 2.

  How can I open the panel with correct information?

Hello Angel,

As you can see in google documentation (https://developers.google.com/maps/do...) you should use marker as second parameter of infowindow.open() method

Thanks for your response.I have tried using infowindow.open(map, this.marker);, but I have the same problem. Always apeears in panel info of last element.

Hello Angel,

Sorry for delay. Unfortunately this question is seems to be outside the scope of our support, perhaps you should contact Google support to clarify this issue.

Hello Angel Garcia,

Did you solve this problem(details page with click infowindow)? I am working on a same kind of project... and ı couldn't make it work.

Yes taucher, I made it:

Thanks Angel. But here is my code:

I open the infowindow and suddenly navigateTo my detail page. Detail page reads the "selectedCoordinate" local variable. But i can not save the on map selected marker's JSON value in to the "selectedCoordinate" variable.

codevar obj = JSON.parse(list_coordinate);

var coordsArray = obj;

var image = 'files/views/assets/image/jalog32.png';

var infowindow = new google.maps.InfoWindow();

var map = Appery("google_map").gmap;

for (var i = 0, j = coordsArray&#46;length; i < j; i++) {

 var marker = new google.maps.Marker({ 
 position:  new google.maps.LatLng(coordsArray[i].location.latitude, coordsArray[i].location.longitude), 

map: map,
icon: image,
title: coordsArray&#46;job
});
markers&#46;push(marker);

google&#46;maps&#46;event&#46;addListener(marker, 'click', function() {

 Apperyio.storage.selectedCoordinate.set(coordsArray); 
 infowindow.open(Appery("google_map").gmap,this); 
 infowindow.setContent('İlan Başlığı: ' + this.getTitle()); 
 Apperyio.navigateTo('isDetaylariPage', 
 {transition: 'none', 
  reverse: false}); 

});
}}/code

Not working!!!

This code is saving all the "coordsArray" as same to the "selectedCoordinate" variable

I changed codeApperyio&#46;storage&#46;selectedCoordinate&#46;set(coordsArray)/code with codeApperyio&#46;storage&#46;selectedCoordinate&#46;set(coordsArray[this&#46;index]);/code

and added codeindex : i/code to the marker area.

Now working!

Well!

I have the reverse. I can map my local storage array to the map component and display each marker. But clicking the marker displays empty values. Maybe it is the same and I just haven't clicked the last marker. I don't understand how this is out of the scope of Appery?

Please at least provide a good code sample for how to work with local storage arrays. Please.