datasette-cluster-map

一个 Datasette 插件，可检测包含 latitude 和 longitude 列的表格，然后使用 Leaflet.markercluster 将它们绘制在地图上。

演示

global-power-plants.datasettes.com 托管了此插件的演示，该演示使用一个包含全球 33,000 个发电厂的数据库运行。

安装

运行 datasette install datasette-cluster-map 将此插件添加到您的 Datasette 虚拟环境中。如果以这种方式安装，Datasette 将自动加载该插件。

如果您使用 datasette publish 命令进行部署，可以使用 --install 选项

datasette publish cloudrun mydb.db --install=datasette-cluster-map

如果您的任何表格包含以下任一列对，将自动显示地图

latitude 和 longitude
lat 和 lng
lat 和 lon
lat 和 long
*_latitude 和 *_longitude
*_lat 和 *_lng (适用于 lng 的任何三种变体)

配置

如果您的列名不同，您可以使用 metadata.json 文件中的插件配置来配置列名。例如，如果您的所有列都名为 xlat 和 xlng，您可以创建一个如下所示的 metadata.json 文件

{
    "title": "Regular metadata keys can go here too",
    "plugins": {
        "datasette-cluster-map": {
            "latitude_column": "xlat",
            "longitude_column": "xlng"
        }
    }
}

然后像这样运行 Datasette

datasette mydata.db -m metadata.json

这将为该 Datasette 实例加载的每个数据库配置所需的列名。

如果您只想自定义一个数据库中某个表的列名，可以这样做

{
    "databases": {
        "polar-bears": {
            "tables": {
                "USGS_WC_eartag_deployments_2009-2011": {
                    "plugins": {
                        "datasette-cluster-map": {
                            "latitude_column": "Capture Latitude",
                            "longitude_column": "Capture Longitude"
                        }
                    }
                }
            }
        }
    }
}

您还可以使用自定义 SQL 查询将这些列重命名为 latitude 和 longitude，例如

select *,
    "Capture Latitude" as latitude,
    "Capture Longitude" as longitude
from [USGS_WC_eartag_deployments_2009-2011]

地图默认显示在页面主要结果表上方。您可以使用 "container" 插件设置来提供一个 CSS 选择器，指明地图应附加到哪个元素。

自定义瓦片图层

您可以使用 tile_layer 和 tile_layer_options 配置设置来自定义地图使用的瓦片图层。例如，要使用 OpenTopoMap，您可以使用以下设置

OpenStreetMap contributors, SRTM | Map style: © OpenTopoMap (CC-BY-SA)", "maxZoom": 17 } } } }">

{
    "plugins": {
        "datasette-cluster-map": {
            "tile_layer": "https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png",
            "tile_layer_options": {
                "attribution": "Map data: © OpenStreetMap contributors, SRTM | Map style: © OpenTopoMap (CC-BY-SA)",
                "maxZoom": 17
            }
        }
    }
}

如果您的瓦片服务器提供视网膜屏幕瓦片，请将 "detectRetina": true 添加到 tile_layer_options 中以启用它们。

Leaflet Providers 预览列表包含许多其他可用瓦片图层的详细信息。

自定义标记弹出窗口

标记弹出窗口默认显示底层数据库行的数据。

您可以通过在结果中包含一个名为 popup 的列来自定义此设置，该列包含定义更有用弹出窗口的 JSON 数据。

popup 列中的 JSON 应类似于这样

{
    "image": "https://niche-museums.imgix.net/dodgems.heic?w=800&h=400&fit=crop",
    "alt": "Dingles Fairground Heritage Centre",
    "title": "Dingles Fairground Heritage Centre",
    "description": "Home of the National Fairground Collection, Dingles has over 45,000 indoor square feet of vintage fairground rides... and you can go on them! Highlights include the last complete surviving and opera",
    "link": "/browse/museums/26"
}

这些列都是可选的。

title 是显示在弹出窗口顶部的标题
image 是要在弹出窗口中显示的图像的 URL
alt 是该图像要使用的 alt 属性
description 是用作描述的较长文本字符串
link 是标记内容应链接到的 URL

您可以使用 SQLite 的 json_object() 函数在 SQL 查询中动态构建此数据。这是一个示例

select json_object(
  'image', photo_url || '?w=800&h=400&fit=crop',
  'title', name,
  'description', substr(description, 0, 200),
  'link', '/browse/museums/' || id
  ) as popup,
  latitude, longitude from museums
where id in (26, 27) order by id

在此尝试该示例或查看使用 SQL 视图构建的此演示。

我如何部署演示

datasette publish cloudrun global-power-plants.db \
    --service global-power-plants \
    --metadata metadata.json \
    --install=datasette-cluster-map \
    --extra-options="--config facet_time_limit_ms:1000"

开发

要在本地设置此插件，首先检出代码。然后创建一个新的虚拟环境

cd datasette-cluster-map
python3 -mvenv venv
source venv/bin/activate

或者如果您使用 pipenv

pipenv shell

现在安装依赖项和测试

pip install -e '.[test]'

运行测试

pytest

datasette-cluster-map 作者：simonw

README 源代码

datasette-cluster-map

演示

安装

配置

自定义瓦片图层

自定义标记弹出窗口

我如何部署演示

开发