作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用 ngMap在一个项目中,我在不同的 View 上有不同的 map 。我有一个初始页面,其中显示了一张 map 并绘制了一个多边形和一些标记。我的 Controller 是这样的:
$scope.showInitialMap = function( map ) {
/*Resize image to show on map*/
var iconGood = {
url: 'modules/cars/img/ambulance_ok.png',
scaledSize: new google.maps.Size( 40, 40 ),
origin: new google.maps.Point( 0, 0 ),
anchor: new google.maps.Point( 0, 0 )
};
/*Get all cars*/
$scope.tracks = Tracks.getTaxisRealTime( function() {
angular.forEach( $scope.tracks, function( c ) {
var infowindow = new google.maps.InfoWindow( {
content: contentString
} );
/*Set marker position fo each car*/
var marker = new google.maps.Marker( {
position: {
lat: c.Latitude,
lng: c.Longitude
},
icon: iconGood,
map: map
} );
} );
/*draw map*/
setArea( map );
} );
};
我只是像这样将它添加到 View 中:
<section data-ng-controller="MapsCtrl" ng-init="InitTaxiHistory()">
<ng-map center="[19.54, -96.91]" zoom="13" style="height: 600px;" min-zoom="12">
</ng-map>
</section>
问题是,当我转到另一个显示 map 的 View 时,它会保持我离开上一张 map 时的相同状态。
如何重置 map ?或者如何为 map 创建 2 个不同的实例?
最佳答案
创建 Google Map
的新实例会使问题变得复杂,根本不推荐。
查看相关问题:
解决方案
对于您的情况,您可以处理每个 ng-map
,使 googlemap
根据您当前的 Controller 显示不同的内容。
<ng-map>
<marker ng-repeat="marker in tracks" position="{{marker. Latitude}}, {{marker. Longitude}}"></marker>
<ng-map>
如果 $scope.tracks
中没有数据并且 $scope.tracks
未定义,标记将被自动删除。
笨蛋 demo .
关于javascript - 清除谷歌地图初始状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43838160/
leaflet:一个开源并且对移动端友好的交互式地图 JavaScript 库 中文文档: https://leafletjs.cn/reference.html 官网(英文): ht
我是一名优秀的程序员,十分优秀!