0
我试图在google地图上显示带有标签的标记。我正在使用markerwithlabel.js库,它允许我实现这一点。基本上我可以提交一些HTML + CSS作为标记标签,它会显示在地图上。Html css在图像右侧对齐
所有的作品在这个意义上都很好,我只是想让它更好看,并显示与图像标记内嵌的标签和持续时间。
这是怎么看的那一刻:
我想在蓝圈的右侧显示Norwich \n 1hour
。
你能帮我用CSS和HTML吗?
HTML和JS:
var markerHTML = '{0}<br>{1}'.format(places[i].name, '1hour');
var marker = new MarkerWithLabel({
position: new google.maps.LatLng(lat, lng),
draggable: false,
raiseOnDrag: true,
map: map,
labelContent: markerHTML,
labelAnchor: new google.maps.Point(22, 0),
labelClass: "labels", // the CSS class for the label
labelStyle: {opacity: 1.0},
icon: "images/markers/blue_circle.png"
});
CSS:
.labels {
font-family: "Lucida Grande", "Arial", sans-serif;
font-size: 12px;
font-weight: bold;
text-align: left;
width: 100px;
white-space: normal;
word-spacing: 9999999px;
display: inline;
margin: 5%;
color: #000000;
filter:alpha(opacity=1);
}
这'width'财产可能是问题。尝试删除它或将其设置得更宽。 – jmargolisvt
请提供一个[最小,完整,测试和可读示例](http://stackoverflow.com/help/mcve)来说明问题。 – geocodezip