IT筆記 :Leaflet開源JavaScript地圖學習篇(2)
使用L.circle繪畫圓形，半徑 = 500 m,例子如下:
L.circle([22.450669219333417, 114.18014627779849], 500,{color: "red", weight: 8,fillColor:"blue"}).addTo(map);
同樣，我們可以用 L.rectangle 函數來繪製矩形，範例如下：
Source code modified from Leaflet.Js Essentials by Paul Crickard III:
<html>
<head><title>Leaflet.js Essentials</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin="" />
</head>
<body>
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script>
<div id="map" style="width: 800px; height: 600px"></div>
<script>
var map = L.map('map',
{
center: [22.450669219333417, 114.18014627779849],
zoom: 14
});
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png').addTo(map);
L.circle([22.450669219333417, 114.18014627779849], 500,{color: "red", weight: 8,fillColor:"blue"}).addTo(map);
</script>
</body>
</html>
Comments