gpt4 book ai didi

javascript - Angular 谷歌地图窗口不显示

转载 作者:行者123 更新时间:2023-11-28 08:05:58 24 4
gpt4 key购买 nike

除了轮询之外,当我手动向 map 添加点时,我无法显示窗口。只有预先填充标记数组才有效。例如,如果数组预先填充了 1 个标记,然后我在 map 加载后手动添加第二个标记,则第一个标记将显示窗口,但第二个标记不会显示。这是具有不同纬度/经度的相同标记。据我所知,我的代码几乎与这个骗子相同,除了我不轮询数据。

http://plnkr.co/edit/nbX0BIxNhxFrpzpruRWb?p=preview

http://54.210.49.244:4000/gMaps

我用来娱乐的个人网站。是的,我懒得去获得一个真正的域名。免费的,好吧XD说明了问题。不支持 IE 9 或更低版本。

这是 Controller 逻辑。

.controller("gMapsController", ["$scope", '$location', function($scope, $location){
$scope.welcomeMessage = "Welcome to Google Maps Playground"

$scope.map = {
center: {
latitude: 44.41748017333282,
longitude: 26.106005249023376
},
zoom: 12
}
$scope.id = 0;
$scope.map.bounds = {};
$scope.map.randomMarkers = [{
id: 0,
latitude: 44.42138408826953,
longitude: 26.25385948707207,
showWindow: false,
title: "m9"
},
{
id: 1,
latitude: 44.39138408826953,
longitude: 26.21385948707207,
showWindow: false,
title: "m9"
}];

$scope.id++;
$scope.id++;
$scope.id++;

angular.forEach($scope.map.randomMarkers, function(marker) {
marker.showWindow = false;

marker.onClick = function() {
console.log('on click - opening window');
marker.showWindow = true;
$scope.$apply();
}

marker.closeClick = function() {
console.log('close click - hiding window');
marker.showWindow = false;
$scope.$apply();
}

console.log(marker);

});


var generateMarkers = function(markers) {


markers.showWindow = false;

markers.onClick = function() {
console.log('on click - opening window');
markers.showWindow = true;
$scope.$apply();
};

markers.closeClick = function() {
console.log('close click - hiding window');
marker.showWindow = false;
$scope.$apply();
};

console.log(markers);


$scope.map.randomMarkers.push(markers);

};

$scope.generateMarker = function(){
var marker = {
id: $scope.id,
latitude: 44.41138408826953,
longitude: 26.23385948707207,
showWindow: false,
title: "m9",
draggable: true
};
console.log("marker added");
generateMarkers(marker);
$scope.id++;
};

景色

div.container
button(type = "button", ng-click="generateMarker()") Add a Marker
div.row()
div(class = "col-md-6")
google-map(center="map.center", zoom="map.zoom", draggable="true", bounds="map.bounds", control="map.control")
markers(models="map.randomMarkers", coords="'self'", icon="'icon'", click="'onClick'")
windows(show="'showWindow'", closeClick="'closeClick'", ng-cloak)
div
| Window with additional information

最佳答案

查看 issues Angular 谷歌地图:

https://github.com/nlaplante/angular-google-maps/issues/354似乎与您的问题有关(毕竟您的方法位于 $scope 中)和 has a fix here .

关于javascript - Angular 谷歌地图窗口不显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24783182/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com