谷歌地图圈似乎是手绘图像

时间:2015-07-16 15:47:20

标签: google-maps google-maps-api-3 google-maps-markers

Google地图圈子看起来像是手绘的。

圆圈脚本是:

var circle = new google.maps.Circle({

    center: myLatLng,
    radius:1000,
    strokeColor: "#000000",
    strokeOpacity:1,
    fillOpacity:0.4,
    strokeWeight: 2,
    fillColor: "#000000",
    map:map
});

我们可以让圈子更精细调整。

enter image description here

我的要求是在带有微调圆圈边框的标记周围显示圆圈。

enter image description here

1 个答案:

答案 0 :(得分:-1)

您可以尝试使用符号。我不相信可以选择使用“手绘”样式来改变这些圈子。这很奇怪,因为它们的矩形似乎没有使用那种外观。

这是一个例子: https://developers.google.com/maps/documentation/javascript/examples/marker-symbol-predefined

function initialize() {
      var mapOptions = {
        zoom: 4,
        center: new google.maps.LatLng(-25.363882, 131.044922)
      };

      var map = new google.maps.Map(document.getElementById('map-canvas'),
          mapOptions);

      var myCircle = {
        path: google.maps.SymbolPath.CIRCLE,
        fillColor: 'red',
        fillOpacity: 0.8,
        scale: 20,
        strokeColor: 'black',
        strokeWeight: 3
      };

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

以下是标记周围的圆圈示例:

    function initialize() {

    var myLatlng = new google.maps.LatLng(16.5083,80.64);var mapOptions = {zoom: 12,center: myLatlng};
    var map = new google.maps.Map(document.getElementById('map-canvas'),mapOptions);
    var marker = new google.maps.Marker({map: map,position: myLatlng});

    var circle = new google.maps.Circle({
      map: map,
      radius: 2000,
      fillColor: '#000000',
      fillOpacity: 0.4,
      strokeColor: '#000000',
      strokeWeight: 2
    });

    circle.bindTo('center', marker, 'position');
    }

    google.maps.event.addDomListener(window, 'load', initialize);