2012-09-01 10 views
7

मैं सर्कल के त्रिज्या या सर्कल के केंद्र से सर्कल के किनारे (डिग्री में एक सटीक समन्वय पर) को खींचने का एक तरीका ढूंढ रहा हूं।जावास्क्रिप्ट में Google मानचित्र एपीआई, एक सर्कल के त्रिज्या ड्रा?

क्या यह संभव है? कैसे?

वर्तमान में, मैंने अपने मानचित्र के केंद्र से एपीआई के साथ एक सर्कल खींचा। मुझे नहीं लगता कि यह मदद करता है ...

का उदाहरण क्या मैं करूंगा: 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) 
+0

आपको वह कोड पोस्ट करना चाहिए जिसे आपने अभी तक आजमाया है। –

+0

मैंने पोस्ट संपादित किया है :) –

उत्तर

1

इस के लिए एकदम सही बात google.maps.geometry.spherical नाम स्थान से computeOffset(from:LatLng, distance:number, heading:number, radius?:number) समारोह, के रूप में documentation

में संदर्भित है वहां से सर्कल के केंद्र से ऑफलाइन के रूप में स्वयं के त्रिज्या के साथ एक पॉलीलाइन बनाएं, आप एक त्वरित उदाहरण देख सकते हैं जिसे मैंने here बनाया है (बस इसे देखने के लिए मानचित्र के चारों ओर क्लिक करें)

+0

यह वही है जो मुझे चाहिए! धन्यवाद। –

+0

बाद में पॉलीलाइन को स्थानांतरित करने का कोई तरीका है? इसे एक नया "पथ" दें? –

+0

@ स्कोफ्रेड हां, पॉलीलाइन में 'getPath' और' setPath 'विधियां हैं, आप उन्हें [दस्तावेज़] (https://developers.google.com/maps/documentation/javascript/reference#Polyline) में देख सकते हैं – lccarrasco

8

इस (सुनिश्चित नहीं हैं, तो यह आपके लिए क्या पूछा है) की कोशिश करो

HTML:

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

जे एस:

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

संदर्भ:Here और this उपयोगी हो सकता है।

+1

आपकी मदद के लिए धन्यवाद लेकिन यह मेरी ज़रूरत नहीं है। –

संबंधित मुद्दे