Question

我正在使用MarkerWithLabel和Google Maps v3 Javascript API。

我当前创建自定义标记，并使用MarkerWithLabel的labelContent属性来显示我的图标。我是这样做的，这样我就可以根据标题动态旋转图标。这完美无瑕。

现在，我想在图标上添加一个标签。

我的代码：

var iconLabel = document.createElement("img");
iconLabel.src = icn+"f.png";
iconLabel.setAttribute("id","img"+$i);

var marker = new MarkerWithLabel({
    position: point,
    icon: boatIcons["blank"],
    shadow: boatIcons["blank"],
    draggable: false,
    map: theMap.map,
    flat: true,
    optimized: false,
    visible: true,
    labelContent: iconLabel, 
    labelAnchor: new google.maps.Point(16,16), 
    labelClass: "labels", 
    labelVisible: true,
    labelStyle: {opacity: 0.75},
    labelInBackground: false
});

这样可以很好地创建IMG。但是如何创建DIV，添加一些文本，然后添加上面的IMG，然后将其添加到我的标记？

Answer 1

从我的代码中查看以下代码段： -

var marker5 = new MarkerWithLabel({position: latlngE, 
    draggable: false,
    raiseOnDrag: false, 
    labelContent: "Pnt: 5",
    labelAnchor: new google.maps.Point(20, 0),
    labelClass: "labels",         // the CSS class for the label
    labelStyle: {opacity: 0.75},
    icon: {url: './images/arrows/Dot.png',
    size: new google.maps.Size(20, 20),
    origin: new google.maps.Point(0, 0)},
    marker: MarkerWithLabel});

关键是指定选项：marker：MarkerWithLabel

查看http://code.google.com/p/jquery-ui-map/wiki/jquery_ui_map_v_3_tutorial

MarkerWithLabel谷歌地图自定义标记

1 个答案: