Question

我正试图用Markercluster绘制半圆。但是，我无法弄清楚我的代码有什么问题：

var marker = new L.circle([-22.2701 , 166.445], 150, {
    startAngle : 330,
    stopAngle : 30,
    fillColor :'#2e8dcd',
    fillOpacity :1
});

https://jsfiddle.net/ihema/d6190rb1/

Answer 1

一系列问题。

您需要加入semicircle plugin。但您需要使用先前版本，因为最后一个版本适用于传单1.0 beta2版本。（所以你必须从https://github.com/jieter/Leaflet-semicircle/tree/gh-pages）下载js

工作示例（你应该下载github文件，而不是直接链接到他们）

var center = L.latLng(-22.2701, 166.445);

var map = L.map('map').setView(center, 17);

var OpenStreetMap_Mapnik = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  maxZoom: 19,
  attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
}).addTo(map);


var markers = L.markerClusterGroup();
var marker = new L.circle([-22.2701, 166.445], 150, {
  startAngle: 330,
  stopAngle: 30,
  fillColor: '#2e8dcd',
  fillOpacity: 1
});
markers.addLayer(marker);
map.addLayer(markers);

#map {
  width: 500px;
  height: 350px;
}

<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.css">
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/leaflet.markercluster/0.4.0/leaflet.markercluster.js"></script>
<script type="text/javascript" src="//raw.githubusercontent.com/jieter/Leaflet-semicircle/gh-pages/Semicircle.js"></script>

<div id="map"></div>

如何使用markercluster绘制SemiCircle？

1 个答案: