我正在尝试将googlemaps v2功能移植到v3。
但不知怎的,我陷入了一个奇怪的错误,我无法找到,我做错了什么。
错误:未捕获的InvalidValueError:setPosition:不是LatLng或LatLngLiteral:在属性lat中:不是数字%7Bmain,adsense,geometry,zombie%7D.js:25
这是我的地图初始化:
var map = new google.maps.Map(document.getElementById("map"),{
zoom:4
size:new google.maps.Size(580,440),
mapTypeControl: true,
mapTypeControlOptions: {
style:google.maps.MapTypeControlStyle.VERTICAL_BAR,
position: google.maps.ControlPosition.BOTTOM_CENTER,
},
panControl: true,
panControlOptions: {
position: google.maps.ControlPosition.TOP_LEFT,
},
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.LARGE,
position: google.maps.ControlPosition.LEFT_CENTER,
},
scaleConrol: true,
scaleControlOptions:{
position: google.maps.ControlPosition.TOP_LEFT ,
},
});
map.setCenter(new google.maps.LatLng(49.477643, 9.316406));
这里是我错误的部分:
function drawTraders(map, options) {
var traders_uri = options.traders_uri || '';
if ('' == traders_uri) {
return false;
}
// get the informations
$.getJSON(traders_uri, function(data) {
// look through the information
$.each(data.traders, function(i, trader) {
var icon = options.icon_image_uri;
var markerIcon = new google.maps.MarkerImage(icon,
// This marker is 20 pixels wide by 32 pixels tall.
new google.maps.Size(25, 25),
// The origin for this image is 0,0.
new google.maps.Point(0,0),
// The anchor for this image is the base of the flagpole at 0,32.
new google.maps.Point(0, 32)
);
var html = 'test';
/*Information from chromium debugger
trader: Object
geo: Object
lat: "49.014821"
lon: "10.985072"
*/
var myLatlng = new google.maps.LatLng(trader.geo.lat,trader.geo.lon);
/*here is the error in new google.maps.Marker()*/
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
icon : markerIcon,
});
var infowindow = new google.maps.InfoWindow({
content: html
});
}
编辑:drawTraders的调用
drawTraders(map, {
traders_uri: "getTraders.php",
icon_image_uri: "icon-cms.gif",
});
我正在使用此示例Info Window
编辑:
答案 0 :(得分:99)
Uncaught InvalidValueError:setPosition:不是LatLng或LatLngLiteral:在属性lat中:不是数字
表示您未将数字传递到google.maps.LatLng构造函数中。根据你的评论:
/*Information from chromium debugger
trader: Object
geo: Object
lat: "49.014821"
lon: "10.985072"
*/
trader.geo.lat和trader.geo.lon是字符串,而不是数字。使用parseFloat将它们转换为数字:
var myLatlng = new google.maps.LatLng(parseFloat(trader.geo.lat),parseFloat(trader.geo.lon));
答案 1 :(得分:21)
我对完全相同的错误消息有同样的问题。最后的错误是,我仍称为地图v2 javascript。我不得不替换:
<script src="http://maps.google.com/maps?file=api&v=2&key=####################" type="text/javascript"></script>
与
<script src="http://maps.googleapis.com/maps/api/js?key=####################&sensor=false" type="text/javascript"></script>
在此之后,它运作良好。我花了一段时间; - )
答案 2 :(得分:3)
我遇到了同样的问题,事实是lat和long的输入应该是String。只有这样我才能管理。
例如:
控制器。
ViewBag.Lat = object.Lat.ToString().Replace(",", ".");
ViewBag.Lng = object.Lng.ToString().Replace(",", ".");
查看 - 功能javascript
<script>
function initMap() {
var myLatLng = { lat: @ViewBag.Lat, lng: @ViewBag.Lng};
// Create a map object and specify the DOM element for display.
var map = new window.google.maps.Map(document.getElementById('map'),
{
center: myLatLng,
scrollwheel: false,
zoom: 16
});
// Create a marker and set its position.
var marker = new window.google.maps.Marker({
map: map,
position: myLatLng
//title: "Blue"
});
}
</script>
我将double值转换为string并在','中替换为'。'所以一切正常。
答案 3 :(得分:1)
$scope.bounds = new google.maps.LatLngBounds();
for (var i = $scope.markers.length - 1; i >= 0; i--) {
$scope.bounds.extend(new google.maps.LatLng($scope.markers[i].coords.latitude, $scope.markers[i].coords.longitude));
};
$scope.control.getGMap().fitBounds($scope.bounds);
$scope.control.getGMap().setCenter($scope.bounds.getCenter());
答案 4 :(得分:1)
使用map.setCenter()
设置地图中心时,我遇到了同样的问题。使用Number()
为我解决了。必须使用parseFloat
截断数据。
代码段:
var centerLat = parseFloat(data.lat).toFixed(0);
var centerLng = parseFloat(data.long).toFixed(0);
map.setCenter({
lat: Number(centerLat),
lng: Number(centerLng)
});
答案 5 :(得分:0)
如果您动态加载坐标,则可能会传递null
值,请在调用地图加载器之前设置检查,即:if(mapCords){loadMap}
答案 6 :(得分:0)
您可以使用这种方式
map = new google.maps.Map(document.getElementById('map'), {
zoom: 16,
center: { lat: parseFloat(lat), lng: parseFloat(lng) },
mapTypeId: 'terrain',
disableDefaultUI: true
});
EX:中心:{lat: parseFloat(lat),lng: parseFloat(lng)},
答案 7 :(得分:0)
我遇到了同样的问题,并解决了。 就我而言,这是由于格式不正确而导致的错误。请检查几何坐标中的第一个和最后一个坐标数组,然后它们必须相同,只有这样才能起作用。希望对您有帮助!
答案 8 :(得分:0)
如何使用一元(+)运算符将其转换为JavaScript中的数字
lat: 12.23
lat: +12.23
取决于用例。这是一个完整的图表,什么有效,什么无效: parseInt vs unary plus - when to use which