ui-gmap-markers和图标可用于所有标记 [英] ui-gmap-markers and icon changeble for all mark
问题描述
我正在尝试使用ui-google-maps库的角度更改地图上每个标记的图标. $scope.map.options.icon
工作,但初始化所有标记的图标.
I am trying to change icon for every markers on a map using ui-google-maps library for angular. $scope.map.options.icon
working but initialize icon for all markers.
对于API,我有图标标签,但不起作用,或者我错过了某些地方.
For the API I have icon tags but not working or somewhere I miss something.
<ui-gmap-markers
idKey="map.dynamicMarkers.id" models="map.dynamicMarkers"
coords="'self'" onMarkerClicked="'onMarkerClicked'"
fit="'true'" doCluster="'true'" clusterEvents="clusterEvents"
options="map.options" icon="'icon'">
</ui-gmap-markers>
并在数据库中获取数据后,在dynamicMarkers对象列表中填充标记列表
and after get data in the database fill list of markers in the dynamicMarkers object list
dynamicMarkers = $scope.allTrees;
$scope.map.options.icon = "http://maps.gstatic.com/mapfiles/ridefinder-images/mm_20_green.png";
_.each(dynamicMarkers, function (marker) {
if (marker.status == 0) {
marker.icon = "http://maps.gstatic.com/mapfiles/ridefinder-images/mm_20_red.png";
} else if (marker.status == 1) {
marker.icon = "http://maps.gstatic.com/mapfiles/ridefinder-images/mm_20_green.png";
} else if (marker.status == 2) {
marker.icon = "http://maps.gstatic.com/mapfiles/ridefinder-images/mm_20_yellow.png";
}
});
$scope.map.dynamicMarkers = dynamicMarkers;
由于某种原因图标未更改.谢谢.
For some reason icon not change. Thanks.
推荐答案
我找到了解决方案!首先只需在marker.icon
位置上设置图标url,而在map.options.icon
上不设置默认图标.
如果您在map.options
中设置了默认图标,然后尝试在无法使用的标记中设置图标!
I found solution! First need only set icon url on marker.icon
place and not set default icon on map.options.icon
.
If you set default icon in map.options
and after try to set icon inside the marker that will not work!
这是工作示例:
<ui-gmap-markers
idKey="map.dynamicMarkers.id" models="map.dynamicMarkers"
coords="'self'" onMarkerClicked="'onMarkerClicked'"
fit="'true'" doCluster="'true'" clusterEvents="clusterEvents"
options="map.options" icon="'icon'">
</ui-gmap-markers>
角度代码
dynamicMarkers = $scope.allTrees;
// not set default icon for the mark
// $scope.map.options.icon = "http://maps.gstatic.com/mapfiles/ridefinder-images/mm_20_green.png";
_.each(dynamicMarkers, function (marker) {
if (marker.status == 0) {
marker.icon = "http://maps.gstatic.com/mapfiles/ridefinder-images/mm_20_red.png";
} else if (marker.status == 1) {
marker.icon = "http://maps.gstatic.com/mapfiles/ridefinder-images/mm_20_green.png";
} else if (marker.status == 2) {
marker.icon = "http://maps.gstatic.com/mapfiles/ridefinder-images/mm_20_yellow.png";
}
});
$scope.map.dynamicMarkers = dynamicMarkers;
这是一个成功的方法.我希望他们能在下一版的angular-google-maps库中修复该错误.我尝试使用angular-google-maps 2.1.5.亲爱的.
It is a catch and works. I hope they fix the bug in the next version of angular-google-maps library. I try with angular-google-maps 2.1.5. Chears.
这篇关于ui-gmap-markers和图标可用于所有标记的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!