Javascript 在 Google 地图中推送新的 LatLng
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8437897/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Push new LatLng in Google Maps
提问by don
I'm trying to push into an arry in which I have all the latlng coordinates of some markers from user input (text field), but I'm having some troubles, since new data it's not pushed into the array. Does anyone knows what I'm doing wrong?
我正在尝试推入一个 arry，其中我拥有来自用户输入（文本字段）的一些标记的所有经纬度坐标，但我遇到了一些麻烦，因为新数据没有被推入数组。有谁知道我做错了什么？
here's my code:
这是我的代码：
var locations = [
new google.maps.LatLng(0.0,0.0),
];
var map;
function initialize()
{
var myLatlng = new google.maps.LatLng(0.0,0.0);
var myOptions =
{
zoom: 4,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: locations[i],
map: map
});
}
}
function add_item(){
var item = document.frm.inputbox.value;
locations.push(item);
document.frm.outputbox.value = locations;
}
and in the body I have the map div and the two input boxes:
在正文中，我有地图 div 和两个输入框：
<div id="map_canvas" style="width:750; height:500"></div>
<form name="frm">
Input<input type="text" name="inputbox" value=""/>
Output<input type="text" name="outputbox" value=""/>
<input type="button" onClick="add_item(); initialize();" value="Push"/>
The function add_item isn't working as I would like it to do though.. the result of add_item is an array with "(0.0,0.0),NEWITEM", so it deletes "new google.maps.LatLng" from the locations variable values. The problem is that I really need the new google.maps.LatLng part, so I would need that the new item is added as a new line inside the brackets []... But I have no ideas...
函数 add_item 没有像我希望的那样工作.. add_item 的结果是一个带有“(0.0,0.0),NEWITEM”的数组，所以它从locations变量中删除了“new google.maps.LatLng”值。问题是我真的需要新的 google.maps.LatLng 部分，所以我需要将新项目添加为括号 [] 内的新行......但我没有想法......
回答by Michal
You have a few of errors here
你这里有几个错误
your locations array is in local scope to initialize function
you have a stray comma after you add the initial location to your array
Your first point is stored as a google LatLng object, but your add_item function simply grabs the text from the input box and tries to push it to an array so if you try and display that location it will error out as the points must be added to the map as LatLng objects
LatLng object expects input to be an two integers, if you store raw input from an input box you will get a string like that "90,0" which is an invalid argument for the LatLng object
您的位置数组在本地范围内以初始化函数
将初始位置添加到数组后，您有一个杂散的逗号
您的第一个点存储为 google LatLng 对象，但您的 add_item 函数只是从输入框中获取文本并尝试将其推送到数组中，因此如果您尝试显示该位置，则会出错，因为必须将点添加到地图作为 LatLng 对象
LatLng 对象期望输入是两个整数，如果您存储来自输入框的原始输入，您将得到一个类似“90,0”的字符串，这是 LatLng 对象的无效参数
so this what your script should look like (not tested)
所以这就是你的脚本应该是什么样子（未经测试）
var map;
var locations = [];
function initialize() {
var myLatlng = new google.maps.LatLng(0.0, 0.0);
var myOptions = {
zoom : 4,
center : myLatlng,
mapTypeId : google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
//if you want to store your coordinates as a stingg you should be consistent
locations.push("0.0,0.0");
show_markers();
}
function show_markers() {
for(var i = 0; i < locations.length; i++) {
//if you are expecting a user to input a single pair of coordinates in the input box you will need to do this
var loc = locations[i].split(",")
var lat = parseFloat(loc[0])
var lng = parseFloat(loc[1])
marker = new google.maps.Marker({
position : new google.maps.LatLng(lat, lng),
map : map
});
}
}
function add_item() {
var item = document.frm.inputbox.value;
locations.push(item);
show_markers();
document.frm.outputbox.value = locations;
}
If you want to store the whole array as google LatLng Objects and you assume that the user will enter data in the input box in lat,long pairs separated by a space you can replace the relevant functions above with.. (and take out the initial locations push from initialize)
如果您想将整个数组存储为 google LatLng Objects 并且您假设用户将在 lat,long 对中以空格分隔的输入框中输入数据，您可以将上面的相关函数替换为 .. （并取出初始位置从初始化推送）
function show_markers() {
for(var i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position : locations[i],
map : map
});
}
}
function add_item() {
locations = [] //assuming that the input box always contains the full set of coordinates you need to reset the locations array
var item = document.frm.inputbox.value;
//assuming that user entered data like this 0.0,0.0 70.2,30.6 33.5,120
var items = item.split(" ");
for (var i=0; i<items.length; i++){
var loc = items[i].split(",")
var lat = parseFloat(loc[0])
var lng = parseFloat(loc[1])
pos = new google.maps.LatLng(lat, lng)
locations.push(pos);
}
show_markers();
document.frm.outputbox.value = locations;
}
