如何在jquerymobile中同时放置两个定位的经纬度位置

how to place two located latitude and longitude place same time in jquery mobile

本文关键字：两个 定位 位置 经纬度 jquerymobile      更新时间：2023-09-26

我们需要一次显示两个位置的纬度和经度。我们有两套像这样的经纬度

[{"Longitude":"17.4954","Lattitude":"78.2960","UserID":3},{"Longitude":"17.3616","Lattitude":"78.4747","UserID":3}]

我的问题是它只显示最后的经度和纬度。我们编码这个

$(all).each(function () {
    alert(this.Longitude);
    alert(this.Lattitude);

    debugger;
     directionsDisplay = new google.maps.DirectionsRenderer();
    var mapCenter = new google.maps.LatLng(this.Longitude, this.Lattitude);
    debugger;
    var myOptions = {
        zoom:7,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        center: mapCenter

    }
    debugger;
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    directionsDisplay.setMap(map);
  //  directionsDisplay.setPanel(document.getElementById("directions"));  
// marker will be displayed on the lat long position
var marker = new google.maps.Marker({
position:mapCenter,
map: map
});
});

所有变量都是动态的，这意味着一段时间它也会到达10个位置任何人都告诉我我的代码出了什么问题。请指导我。

假设您有这个数组

var markersArray = [{"Longitude":"17.4954","Lattitude":"78.2960","UserID":3},{"Longitude":"17.3616","Lattitude":"78.4747","UserID":3}]

所以如果你运行console.log(markersArray.length)，你会得到这个输出

2

现在我们还好吗？

现在我们需要一个带有for循环的函数来创建基于markersArray 的标记

像这样的函数。

function createMarkers(){
  for(var i = 0 ; i <markersArray.length ; i++) {
      lat = markersArray[i].Lattitude;
      long = markersArray[i].longitude;
      var marker = new google.maps.Marker({
        position: new google.maps.LatLng(lat, long),
        map: map,
        icon: 'http://maps.google.com/mapfiles/ms/icons/blue-dot.png'
      });
    }
}

解释我需要将您的代码放在我的代码中的何处

您需要将此代码放置在initializeMap()函数（或用于初始化映射的任何函数名）中。

createMarkers()<--像这个

HTML

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>
<div id="map_canvas" style="width:100%;height:100%; position:absolute;"></div>

JAVASCRIPT

var all=[{"Longitude":"17.3616","Lattitude":"78.4747","UserID":3},{"Longitude":"17.4954","Lattitude":"78.2960","UserID":3}];
var map;
 var infowindow = new google.maps.InfoWindow();
$(all).each(function (key, value) {
    if(key == 0){
        map = new google.maps.Map(document.getElementById('map_canvas'), {
          zoom: 6,
          center: new google.maps.LatLng(this.Lattitude, this.Longitude),
          mapTypeId: google.maps.MapTypeId.ROADMAP
        });
    }       
   var marker = new google.maps.Marker({
        position: new google.maps.LatLng(this.Lattitude, this.Longitude),
        map: map
   });
   var content = this.Lattitude+", "+this.Longitude;
   google.maps.event.addListener(marker, 'click', (function(marker, key) {
        return function() {
          infowindow.setContent(content);
          infowindow.open(map, marker);
        }
   })(marker, key));
});
相关文章：