Google maps Angular2谷歌地图样式标记

我们正在使用Angular2谷歌地图（） 我已经让样式化的谷歌地图与这个Plunkr一起工作：

然而，现在我希望做完全相同的标记，我需要一个标签与我的标记。当我使用与styledMap相同的方法进行操作时，我只能使用

getNativeMap（）

访问

nativeMap

。但不是本地标记

---

有什么想法吗？

我不知道你使用的是哪种类型的谷歌地图，我使用了primeng GMap，你可以用这样的标记选项定制你的标记

new google.maps.Marker({position: {lat: 36.879466, lng: 30.667648}, title:"Konyaalti", icon: icon})

在这里，您可以将任何类型的图标标记到google marker 看这里

---

假设您正在使用组件与谷歌地图一起工作

由于google不支持带有现成标签的标记，我创建了使用markerwithlabel js库的自定义组件

创建默认的“sebm”实例，并将自定义标记组件放置在其中

map.component.html模板示例：

<sebm-google-map
        [latitude]="lat"
        [longitude]="lng"
        [zoom]="zoom"
        [disableDefaultUI]="true"
        [zoomControl]="false"
        [streetViewControl]="false">

    <custom-map-marker
        *ngFor="let cluster of clusters; let i = index"
        [markersInCluster]="cluster.markers"
        [addressId]="cluster.address_id"
        [lat]="cluster.coordinates.lat"
        [lng]="cluster.coordinates.lng"
        [label]="cluster.price.raw"
        [isViewed]="true"
        (markerClick)="onMarkerClick($event)">
    </custom-map-marker>

</sebm-google-map>

其中，自定义地图标记是我创建的自定义组件。 我已经为你们创造了要点。您必须切断代码中不需要的部分，这也是为RC4编写的，所以从angular RC5开始，您必须将组件包装到模块中

要点代码：

后来我可以创建工作plnkr

提供的要点的结果应如下所示：

---

这里有一个变通方法，来自google maps API文档，标签可以是字符串或MarkerLabel对象规范，因此不使用字符串作为标签，而是指定MarkerLabel对象并将其作为变量输入，例如：

let markerLabelObject = {
color: "red",
fontFamily: "monospace",
fontSize: "13",
fontWeight: "100",
text: element.names
}
this.markers.push({
lat: element.latitude,
label: markerLabelObject, //<<----the object you defined 
lng: element.longitude
})

让markerLabelObject={
颜色：“红色”，
fontFamily：“单空间”，
字体大小：“13”，
重量：“100”，
text:element.name
}
这个，推({
纬度：元素纬度，
label:markerLabelObject，//想设置一些图标而不是正式的标记吗？plunker不工作抛出未找到？你让它工作了吗？我几乎工作了。你说我需要MarkerWithLabel.js文件。这很清楚。但我使用node进行模块管理，它抛出了以下错误：找不到名称“google”。你是如何让它工作的ng with Bower？上述解决方案在angular2应用程序中不适用于我。u plz是否可以提供相同的plunkr链接。无法在最新版本的angular2上实现此功能，如果您可以提供有效的plunkr链接，将不胜感激。是的，由于plunker尚未准备就绪，我知道我已经在拉脱维亚的一个房地产网页上看到了此地图：D现在，在互联网上寻找答案：D Sveiciens（问候语）嘿，有人能找到带有标签的自定义标记的解决方案吗？如果是，请分享示例或链接。
let markerLabelObject = {
color: "red",
fontFamily: "monospace",
fontSize: "13",
fontWeight: "100",
text: element.names
}
this.markers.push({
lat: element.latitude,
label: markerLabelObject, //<<----the object you defined 
lng: element.longitude
})