README

一个用于绘制 Leaflet 地图的 Craft CMS 3 字段插件。

要求

此插件需要 Craft CMS 3.0.0-beta.23 或更高版本。

安装

要安装此插件，请按照以下说明操作。

打开您的终端并转到您的 Craft 项目目录
```
 cd /path/to/project
```
然后告诉 Composer 加载此插件
```
 composer require vardump/geojsonmap
```
在控制面板中，转到设置 → 插件，并点击 geojsonmap 的“安装”按钮。

前端显示

<link href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" rel="stylesheet"/>
<script src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js"></script>
                
<div id="map" style="height: 500px;"></div>  
<div id="geojson" style="display: none">{{ entry.geojsonField }}</div>

<script>
// Create the map
var map = L.map(document.getElementById('map')).setView([47.9034, 8.10577], 10);
  
// Set up the OSM layer
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: 'Data ©<a href="http://osm.org/copyright">OpenStreetMap</a>',
    maxZoom: 18
}).addTo(map);

// Create featureGroup
var layer = L.featureGroup().addTo(map);

// Draw Geojson
var geojson = document.getElementById('geojson');
if (geojson.innerHTML) {
    var geojsonLayer = L.geoJson(JSON.parse(geojson.innerHTML))
    geojsonLayer.eachLayer(function (l) {
      layer.addLayer(l)
    })
    map.fitBounds(layer.getBounds())
}
</script>

由 vardump.de 提供

vardump / geojsonmap

维护者

详情

README

要求

安装

前端显示