0

さらに何かを実装しようとする前に、Google Code Playground でこれをテストしてきました。

これは単に地図上に地図マーカーを配置し、マイルで指定された半径で円のオーバーレイを生成します。しかし、私はまだこれを機能させることができません。

円オーバーレイの作成で壊れているようです。私は解決策を探していましたが、これまでに試したことはすべて壊れる (マップが表示されない) か、結果が得られません (円のオーバーレイが表示されません)。

注: 同様の質問 [question:] Circle overlay in Google Map V3 API jsに遭遇しました。この解決策を試しましたが、うまくいきませんでした。 

function initialize()
{
  if (GBrowserIsCompatible())
  {
    var map = new GMap2(document.getElementById("map_canvas"));
    map.setCenter(new GLatLng(30.6957, -88.1813), 13);


    var latlng = new GLatLng(30.6957, -88.1813);
    map.addOverlay(new GMarker(latlng));

    var draw_circle = null;

    function Draw_Circle(Miles)
    { 
      Miles *= 1600;

      if (draw_circle != null)
      {
        draw_circle.setMap(null);
      }

      draw_circle = new google.maps.Circle({
        center: latlng,
        radius: Miles,
        strokeColor: "#FF0000",
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: "#FF0000",
        fillOpacity: 0.35,
        map: map
      });  
    }

    Draw_Circle(15);
  }
 }

よろしくお願いします。

編集:APIバージョンを混在させていたことが通知されたので。私は次のことを思いつきました：

var latLng;

function initialize() {
  var map;
  var mapDiv = document.getElementById('map-canvas');
  map = new google.maps.Map(mapDiv, {
    center: new google.maps.LatLng(30.6957, -88.1813),
    zoom: 13,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });

  latLng = new google.maps.LatLng(30.6957, -88.1813);
  var marker = new google.maps.Marker({
      position: latLng,
      map: map
    });

  var draw_circle = null;

  function Draw_Circle(Miles)     
  {        
    Miles *= 1600;        
    if (draw_circle != null)       
    {         
      draw_circle.setMap(null);       
    }       

    draw_circle = new google.maps.Circle({         
      center: latlng,         
      radius: Miles,         
      strokeColor: "#FF0000",         
      strokeOpacity: 0.8,         
      strokeWeight: 2,         
      fillColor: "#FF0000",         
      fillOpacity: 0.35,         
      map: map       
     });

  }      

  Draw_Circle(15);
}

私はほとんどそこにいます...今、円のオーバーレイの問題を示すデバッガーからのエラーメッセージはありません。

4

1 に答える 1

1

問題 1 : Google Maps API V2とGoogle Maps API V3を一緒に使用しています。

問題 2 : 次のコードで

.....
draw_circle = new google.maps.Circle({         
  center: latlng,   
  .....

スローされるエラーはReferenceError: latlng is not definedです。

に置き換えるlatlngとlatLng、スクリプトは期待どおりに機能します。

于 2012-11-30T09:44:25.440 に答える