Angular 4 Google Maps如何向标记添加描述 [英] Angular 4 Google Maps how to add description to marker

查看:77
本文介绍了Angular 4 Google Maps如何向标记添加描述的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用角度4和Google角度地图.

I am using angular 4 and angular google maps.

我想添加带有如下描述的标记:

I want to add marker with description like that:

关于角度图的文档确实很差,我找不到类似的东西.

Documentation for angular maps is really poor and I couldn't find anything like that.

我知道如何添加标记,但是唯一具有的属性是标题,但是当我们将鼠标移到标记上时会显示该属性.我该怎么办?

I know how to add marker but only property it has is title but it is displayed when we move mouse over the marker. What can I do?

推荐答案

我发现的解决方案虽然一点也不漂亮,但是您不必使用任何外部api,基本上,您可以使用label属性显示文本并添加文本开头要留一些多余的空格,因为既然标签可用的唯一属性是(颜色,fontFamily,fontSize,fontWeight,文本),则不能向其中添加样式类

The solution I found is not pretty at all but you won't have to use any external api, basically you use the label property to display the text and add some extra spaces in the beginning of the text because since the only properties available to the label are (color, fontFamily, fontSize, fontWeight, text) you can't add a style class to it

let  markerLabel = {
  text: this.stringWithSpaces('King's Cross',15),
  color: 'red'
}

stringWithSpaces(string, n){
  return Array(n).join('\xa0')+string
}

let marker = new google.maps.Marker({
  position: latLon,
  label: markerLabel,
  map: map,
  icon: {...}
});

我尚未对此进行大量研究,但是如果您愿意,可以尝试使用此 https ://github.com/jesstelford/node-MarkerWithLabel

I haven't done a lot of research on it but if you want you can try using this https://github.com/jesstelford/node-MarkerWithLabel

这篇关于Angular 4 Google Maps如何向标记添加描述的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆