来自 DB 的 Google Map 问题解决位置答案

【问题标题】：Google Map issue addressing location from DB来自 DB 的 Google Map 问题解决位置
【发布时间】：2016-07-22 09:43:28
【问题描述】：

这条线不工作，控制台没有错误。

position: new google.maps.LatLng( coordsArray[i].location ),

alert(coordsArray[i].location);location 确认的数据是返回 LatLng -43.59670,172.38247 作为字符串的数据库字段。

这条线有效：position: new google.maps.LatLng( -43.59670,172.38247 ), 什么是与上面相同的数据，任何想法我的代码有什么问题？

var list_location = localStorage.getItem('myHouse');
var obj = JSON.parse(list_location);
var coordsArray = obj;
var marker;
var locX;
var image = 'http://apppics.weebly.com....png';
var map = Appery("googlemap_6").options.mapElement.gmap('get', 'map');


var CreateMarker = function(coordsArray, i){
var marker = new google.maps.Marker({
position: new google.maps.LatLng( coordsArray[i].location ), 
//position: new google.maps.LatLng( -43.59670,172.38247 ),

title: coordsArray[i].storeName,
map: Appery("googlemap_6").gmap,
});

for (var i = 0, j = coordsArray.length; i < j-1; i++)
alert(coordsArray[i].location);
CreateMarker(coordsArray, i);

【问题讨论】：

标签： javascript google-maps-api-3

【解决方案1】：

这是不正确的：new google.maps.LatLng(coordsArray[i].location)。

您声明：“位置是数据库字段，以字符串形式返回 LatLng -43.59670,172.38247。”

google.maps.LatLng 构造函数接受两个数字作为参数（不是逗号分隔的字符串）。

如果coordsArray[i].location 是逗号分隔的字符串，则将其转换为两个数字。

var coords = coordsArray[i].location.split(",");
var latLng = new google.maps.LatLng(parseFloat(coords[0]), parseFloat(coords[1]));
var marker = new google.maps.Marker({
  position: latLng,
  map: map
});

代码 sn-p：

var geocoder;
var map;

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var location = "-43.59670,172.38247";
  coords = location.split(",");
  var latLng = new google.maps.LatLng(parseFloat(coords[0]), parseFloat(coords[1]));
  var marker = new google.maps.Marker({
    position: latLng,
    map: map
  });
  map.setCenter(latLng);

}
google.maps.event.addDomListener(window, "load", initialize);

html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js?"></script>
<div id="map_canvas"></div>

【讨论】：