README

允许您在Craft CMS网站上显示地形图。

要求

此插件需要PHP 7.4 - 8.2，并支持Craft CMS 3.x和4.x。

安装

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

打开您的终端并进入Craft项目
```
cd /path/to/project
```

然后告诉Composer加载插件

composer require burnthebook/craft3-osmaps

在控制面板中，转到设置→插件，并为OS Maps点击“安装”按钮。

配置

在控制面板的插件设置页面中添加您的OS Maps API密钥。
设置最大缩放级别值。如果您不允许显示OS MasterMap Topography层，这通常是10。

使用OS Maps

将以下内容添加到您的twig模板中，并在必要时进行修改。

{% do view.registerAssetBundle("Burnthebook\\OSMaps\\assetbundles\\OSMaps\\OSMapsAsset") %}

{% set tileUrl = craft.osMaps.getApiUrl() %}
{% set maxZoomLevel = craft.osMaps.getMaxZoomLevel() %}
{% set zoomLevel = 10 %}
{% set lat = 52.921309 %}
{% set long = -1.475118 %}

<div id="map" style="height: 500px; width: 500px;"></div>

{% js %}
    var map = createOSMap('map', '{{ tileUrl }}', { maxZoom: {{ maxZoomLevel }} });
    var latlng = [{{ lat }}, {{ long }}];
   
    map.setView(latlng, {{ zoomLevel }});
    L.marker(latlng).addTo(map);
{% endjs %}

有关使用L JavaScript对象的参考，请参阅Leaflet文档。

请注意，createOSMap()函数返回一个Leaflet地图对象。

高级使用

getApiUrl()方法接受一个具有选项的对象。

有关更多详细信息，请参阅OS Maps文档。

我们定义的默认选项是

{% set tileUrl = craft.osMaps.getApiUrl({
    'service': 'WMTS',
    'request': 'GetTile',
    'version': '1.0.0',
    'layer': 'Road 27700',
    'style': 'true',
    'format': 'image/png',
    'tileMatrixSet': 'EPSG:27700',
    'tileMatrix': 'EPSG:27700:{z}',
    'tileRow': '{y}',
    'tileCol': '{x}'
}) %}

如果您在控制面板中使用Google Maps（例如，地图插件），则需要将Google Maps缩放级别转换为OS Maps缩放级别

{% set zoomLevel = craft.osMaps.convertGMapsZoomLevel(entry.map.zoom) %}

createOSMap() JavaScript函数接受以下参数

id : 地图的HTML元素ID
tileUrl : 从中获取瓦片的URL
tileLayerOptions : Leaflet瓦片层对象的选项。有关更多详细信息，请参阅Leaflet文档。
mapOptions : Leaflet地图对象的选项。有关更多详细信息，请参阅Leaflet文档。
crs : 可选的CRS对象。有关创建CRS对象的说明，请参阅Leaflet和/或Proj4leaflet文档。它相当复杂。我们为EPSG:27700提供默认CRS对象。

该函数返回一个标准的Leaflet地图对象。您可以根据需要对其进行处理。

Leaflet库（JS中的L对象）也全局暴露，如果您希望使用它（例如，添加标记或操作地图）。

关于性能的说明

我们通过插件（Craft）代理所有瓦片请求，以防止OS API密钥对公众可见。这从性能角度来看不是最佳方法，但它是由OS要求的。

为了说明这一点

地图（前端）<--> OS Maps插件（Craft）<--> OS Maps API

当用户与地图交互（缩放/平移）时，这将触发大量请求到您的服务器 - 更精确地说，每个瓦片一个请求！如果您有大量用户和网站上的大量地图，这可能会成为一个问题！

可能的解决方案是将您的网站放在CDN上（例如CloudFlare），并启用对所有/actions/os-maps/api/*请求的全页缓存，其中/actions是您的actionTrigger配置设置（默认为actions）。

请注意，当OS更新任何瓦片时，您必须清除CDN缓存。

有用的资源

由 Burnthebook 提供

burnthebook / craft3-osmaps

维护者

详细信息

README

要求

安装

配置

使用OS Maps

高级使用

关于性能的说明

有用的资源