0

私は InfoBox プラグインを使用しており、次のコードがあります。

Gmaps.map.infobox = function(boxText) {
  return {
     content: boxText
    ,disableAutoPan: false
    ,maxWidth: 0
    ,pixelOffset: new google.maps.Size(-140, 0)
    ,zIndex: null
    ,boxStyle: {
      background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.5/examples/tipbox.gif') no-repeat"
      ,opacity: 0.75
      ,width: "280px"
       }
    ,closeBoxMargin: "10px 2px 2px 2px"
    ,closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif"
    ,infoBoxClearance: new google.maps.Size(1, 1)
    ,isHidden: false
    ,pane: "floatPane"
    ,enableEventPropagation: false
 }};

寸法が 77x80 ピクセルのマーカーを使用すると、InfoWindow が表示されると、次のようにマーカーの下部に正しく配置されます。

インフォボックスが適切に配置された大きなマーカー

ただし、マーカーのサイズを 35x44 ピクセルに変更すると、InfoWindow はマーカーの下部に正確に配置されません。次の図を参照してください。

インフォボックスが正しく配置されていない小さなマーカー

下部に完全に揃えるにはどうすればよいですか？

編集:小さなマーカーの場合、使用するライブラリ(gmaps4rails)でこれを設定して作成しました:

marker.picture({
                  :picture => "assets/juice-pin-small.png",
                  :width => 35,
                  :height => 44,
                 })

大きなマーカーについては、次のように設定して作成します。

marker.picture({
                      :picture => "assets/juice-pin-small.png",
                      :width => 70,
                      :height => 88,
                      :marker_anchor => [23,78]
                     })
4

1 に答える 1

0

両方のサイズのマーカーを使用する場合は、2 セットのオプションが必要になるため、私が知っていることは間違いなく最善の解決策ではありません。

とにかく、インフォボックスの位置は で変更できpixelOffset: new google.maps.Size(-140, 0);ます。あなたのケースでは、ボックスを左に移動し、最初の数字をより負の数 (-145 など) にします。

別の考え: マーカー自体を編集し、数ピクセルずらします。

于 2012-05-07T01:29:12.447 に答える