私は Address picer マップを使用しています:
https://github.com/sgruhier/jquery-addresspicker
これは、アドレスピッカー ライブラリのコードです。
https://github.com/sgruhier/jquery-addresspicker/blob/master/src/jquery.ui.addresspicker.js
このライブラリは google maps api v3 を使用しており、このマップに円を描きたいと思っています。
アドレスピッカーのコードは次のとおりです。
$(function () {
var addresspickerMap = $("{{ '#' ~ form.vars.name ~ '_address_addressAutocomplete' }}").addresspicker({
map: map,
regionBias: "es",
mapOptions: {
zoom: {{ zoom | default(4) }},
center: new google.maps.LatLng({{ form.vars.data.address.lat | default(40.46366700000001) }}, {{ form.vars.data.address.lon | default(-3.7492200000000366)}}),
scrollwheel: false,
mapTypeId: google.maps.MapTypeId.ROADMAP
},
elements: {
map: "#map",
lat: "{{ '#' ~ form.vars.name ~ '_address_lat' }}",
lng: "{{ '#' ~ form.vars.name ~ '_address_lon' }}",
street_number: "{{ '#' ~ form.vars.name ~ '_address_streetNumber' }}",
route: "{{ '#' ~ form.vars.name ~ '_address_street' }}",
locality: "{{ '#' ~ form.vars.name ~ '_address_location' }}",
administrative_area_level_2: "{{ '#' ~ form.vars.name ~ '_address_region' }}",
administrative_area_level_1: "{{ '#' ~ form.vars.name ~ '_address_state' }}",
country: "{{ '#' ~ form.vars.name ~ '_address_country' }}",
postal_code: "{{ '#' ~ form.vars.name ~ '_address_zipcode' }}"
}
});
var gmarker = addresspickerMap.addresspicker("marker");
gmarker.setVisible(true);
addresspickerMap.addresspicker("updatePosition");
});
このコードが円を描くことを証明しましたが、機能しません:
var circle = new google.maps.Circle({
map: addresspickerMap.gmap,
radius: 16093, // 10 miles in metres
fillColor: '#AA0000'
});
circle.bindTo('center', gmarker.getPosition(), 'position');
どうすればできますか?
ありがとう