google-maps-api-3 - GoogleマップV3で、ポリゴンの内側と上にラベルを付ける方法は?

Question

GoogleマップV3で、ポリゴンの内側と上にラベルを付ける方法は? V2 のようなラベル オーバーレイはありません ライブラリ maplabel を使用すると、より高い Z インデックスを指定しても、テキストを内側に配置できますが、上部には配置できません。ありがとうフィル

Answer 1

maplabel はそのテキストを mapPane のキャンバスにレンダリングします。これは通常、floatPane のすべての zIndex 値の下にレンダリングされます。mapPane キャンバスを zIndex の順序にするには、次を試してください。

var mapLabel = new MapLabel({
    position: new google.maps.LatLng(yourLat, yourLng),
    text: 'test',
    zIndex: 101} );
$(mapLabel.getPanes().mapPane).css('z-index', mapLabel.zIndex);

Answer 2

google-maps-utility-library を使用

ラベルのコンテンツを設定し、ポリゴンの中心位置を見つけてください:)

var labelOptions = {
    content: label,
    boxStyle: {
      textAlign: "center",
      fontSize: "8pt",
      width: "50px"
    },
    disableAutoPan: true,
    pixelOffset: new google.maps.Size(-25, 0),
    position: this.my_getBounds(gpoints).getCenter(),
    closeBoxURL: "",
    isHidden: false,
    pane: "mapPane",
    enableEventPropagation: true
};

var polygonLabel = new InfoBox(labelOptions);
polygonLabel.open(map);