1

GoogleマップでinfoWindowを使用して情報を表示するのに問題があります。この白いdivを小さくして、その中の灰色のボックスのサイズと一致させるようにします。そして、マーカーから白いdivに向かうこの「白い」矢印も小さくしたいと思います。

これが写真です： ここに画像の説明を入力してください

私のコード：

var contentString = '<form >'+
  '<h2><b>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Data:</b></h2>'+
  '<div id="bodyContent">'+
  '<div style=width:220px;display:inline-block;>'+
  '<p>&nbsp;' +'</p>' + '<p>&nbsp;' + '</p>' + '<p>&nbsp;' + '</p>' +
  '<p>&nbsp;' + '</p>' + '</div>'+
  '<div style=width:220px;display:inline-block;>'+
  '<p>&nbsp;' +'</p>' + '<p>&nbsp;' + '</p>' + '<p>&nbsp;' + '</p>' +
  '<p>&nbsp;' + '</p>' + '</div>'+ '</div>'+ '</form>';
var infowindow = new google.maps.InfoWindow({
  content: contentString
});
/* info window */
infowindow.open(map,tracked);
4

1 に答える 1

2

infoWindowのサイズはいくつかの方法で変更できます。1つは、タグのwidth andをに設定することです。これは基本的に白いinfoWindowのスタイルです。だから、。height<form>contentString<form style="width:240px; height:240px">

もう1つのオプションはmaxWidth、infoWindowのオプションを設定することです。のオプションはありませんheight。これは、私が信じるコンテンツに応じて調整されます。infoWindowOptionsについては、GoogleMapsAPIリファレンスを参照してください。次のように設定する必要があります。

    var infowindow = new google.maps.InfoWindow({
        content: contentString,
        maxWidth: 240
    });

ただし、現在のAPIには、「白い」矢印のサイズを変更できる機能はないと思います。infoBubbleライブラリの使用を検討できます。これはGoogleマップで使用できる多くのオープンソースライブラリの1つです（他のライブラリへのリンクは次のとおりです：http ：//code.google.com/p/google-maps-utility- library-v3 / wiki / Libraries）。ほとんどの場合、infoBubbleはinfoWindowと同じように宣言しますが、スタイリングにはさらに多くのオプションがあります。特に、ケースに応じて、arrowSize：を変更できます。

    infoBubble = new InfoBubble({
        content: contentString,
        minWidth: 240, //width of your infoWindow/infoBubble
        arrowSize: 3 //set your desired size            
    });
于 2012-06-28T14:56:47.760 に答える