Google-Maps-API in Javascript, Zeichnen Sie den radius eines Kreises?

Ich bin auf der Suche nach einem Weg, zeichnen Sie den radius des Kreises oder einer Linie vom Mittelpunkt des Kreises zum Rand des Kreises (auf eine genaue Koordinate in Grad).

Ist es möglich? Wie?

Derzeit, ich zeichnete einen Kreis mit der API aus der Mitte meiner Karte. Ich glaube nicht, dass es hilft ...

Beispiel für das, was ich möchte : http://twitpic.com/aq40vv

var sunCircle = {
          strokeColor: "#c3fc49",
          strokeOpacity: 0.8,
          strokeWeight: 2,
          fillColor: "#c3fc49",
          fillOpacity: 0.35,
          map: map,
          center: latlng,
          radius: 1500
        };
        cityCircle = new google.maps.Circle(sunCircle)
  • Sollten Sie nach dem code, die Sie bisher ausprobiert haben.
  • Ich habe bearbeitet die post 🙂
InformationsquelleAutor | 2012-09-01
  1. 1

    Die perfekte Sache, für diese ist die computeOffset(from:LatLng, distance:number, heading:number, radius?:number) Funktion aus der google.maps.geometry.spherical namespace, wie verwiesen, in der Dokumentation

    Von dort aus einfach erstellen Sie eine Polylinie, die aus der Mitte des Kreises mit dem radius von sich selbst "offset" können Sie prüfen, ein schnelles Beispiel das ich gemacht hier (nur klicken, um die Karte zu sehen, dass es funktioniert)

    • Das ist genau das was ich brauche ! Danke.
    • Gibt es eine Möglichkeit, den Polygonzug danach? Geben Sie einen neuen "Pfad"?
    • ja, die Polylinie hat Methoden getPath und setPath, können Sie diese prüfen in der Dokumentation
    • Vielen Dank für Eure Hilfe 🙂
    InformationsquelleAutor lccarrasco
  2. 8

    Versuchen, diese (Nicht sicher, ob dies ist, was Sie gefragt haben)

    HTML:

    <div id="map_canvas"></div>​

    JS:

    var map;
var latlng = new google.maps.LatLng(-34.397, 150.644);
function initialize() {
    var mapOptions = {
        center: latlng,
        zoom: 9,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var el=document.getElementById("map_canvas");
    map = new google.maps.Map(el, mapOptions);

    var marker = new google.maps.Marker({
        map: map,
        position: latlng
    });

    var sunCircle = {
        strokeColor: "#c3fc49",
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: "#c3fc49",
        fillOpacity: 0.35,
        map: map,
        center: latlng,
        radius: 15000 //in meters
    };
    cityCircle = new google.maps.Circle(sunCircle)
    cityCircle.bindTo('center', marker, 'position');
}
initialize();

    DEMO.

    Referenz : Hier und auch diesem nützlich sein könnte.

    • Danke für deine Hilfe aber es ist nicht das, was ich brauche.
    InformationsquelleAutor The Alpha
Schreibe einen Kommentar