22

v2 から v3 へのマップ コードの移行に取り組んでいます。

v2 では、GProjection と Overlay を使用して円を作成しましたが、すべてのズーム レベルで同じサイズに見えます。

v3 では、Google はマップ内に円を作成する Circle クラスを提供しますが、異なるズーム レベルで変化します。

すべてのズーム レベルで同じサイズの円を作成したいと考えています。

すべてのズームレベルで同じサイズの円を作成できることにより、Googleマップv3で他の方法を知りたいです。

前もって感謝します。

4

2 に答える 2

37

画面上で同じピクセル サイズ (地理座標では同じ領域サイズ) の円を作成するには、従来、円形のカスタム アイコンを持つマーカーを使用します。しかし、より柔軟に v3 の比較的新しいシンボルを使用できるようになりました。

var marker = new google.maps.Marker({
  position: new google.maps.LatLng(-122.5,47.5),
  icon: {
    path: google.maps.SymbolPath.CIRCLE,
    fillOpacity: 0.5,
    fillColor: '#ff0000',
    strokeOpacity: 1.0,
    strokeColor: '#fff000',
    strokeWeight: 3.0, 
    scale: 20 //pixels
  }
});

余談: これらのシンボルからクールなアニメーションを作成することもできます: http://googlegeodevelopers.blogspot.com/2012/06/powerful-data-visualization-with.html

于 2012-07-24T17:10:39.923 に答える
10

このコードを使用して、Google マップ V3 でズームとスケーリングの円を管理します。

google.maps.event.addListener(iMap.map, 'zoom_changed', function () {
    for (var i = 0; i < iMap.circle.length; i++) {
        var p = Math.pow(2, (21 - iMap.map.getZoom()));
        iMap.circle[i].setRadius(p * 1128.497220 * 0.0027);
    }

    menu.hide();
});
于 2014-02-04T10:12:20.227 に答える