0

我有一个线和点的示例数据集，代表人们上班的旅程以及他们在哪里感到有交通事故的风险。

现在，数据具有地点（家庭、工作、危险）等属性，以及他们在不同地方担心的事故严重程度。所以更广泛的问题是如何在网络地图上可视化它。为此，我研究了Google Maps、Leaflet 和 OpenLayers3。这些中的每一个看起来都很棒，并且允许漂亮的样式，但在我看来，没有一个具有CartoCSS的简洁性，可实现快速、复杂和直观的样式，如下面的代码用于创建下图：

所以我在瓷砖厂试了一下，这就是我想出的，在通过 TileMill 将东西转换为光栅瓷砖之后。

mb 光栅

但这是一种愚蠢的做事方式：它不能覆盖基础层，并且仅在客户端提供矢量数据并对其进行样式设置会更有效，也许使用类似mapbox.js的东西。但我无法弄清楚如何在客户端使用可爱的 CartoCSS 语言来设置 GeoJSON 文件的样式。（这怎么可能？

ps 这是我对上面地图的样式

#tlines {
  line-width:1;
  line-color: #0b0;
}

#tpoints.points{
  marker-width: 6;
}


#tpoints.points[Place='Danger'] {
  marker-fill:#db0d0d;
}
#tpoints.points[Place='Home'] {
  marker-fill:#db0;
}

#tpoints.points[Severity='1']{
  marker-width: 4;}
#tpoints.points[Severity='2']{
  marker-width: 6;}
#tpoints.points[Severity='3']{
  marker-width: 10;}
4

3 回答 3

1

我无法弄清楚如何在客户端使用可爱的 CartoCSS 语言来设置 GeoJSON 文件的样式。（这怎么可能？

浏览器端无法使用 CartoCSS 样式化功能。

要了解如何在 Mapbox.js/Leaflet.js 中设置 GeoJSON 样式，请查看此处的文档：

于 2014-03-07T20:34:38.980 回答
1

Alex 正确地指出，Leaflet/Mapbox.js 中的矢量样式与 CartoCSS 样式（la Tilemill 或 Mapbox Studio）不同。但是，可以使用 CartoCSS 在浏览器中设置特征样式；它只需要两件事之一：

  1. 一个不同的平台：CartoDB有一个优秀的 JS 库，用于使用 CartoCSS 设置托管数据的样式，基于传单并与 Mapbox 底图完全兼容。
  2. 托管您自己的切片服务器，CartoDB 服务器或Mapbox 构建工具的组合。
于 2015-06-01T16:04:35.527 回答
0

如果你使用 GeoJson 作为数据源，你可以试试 Leaflet.js 的Leaflet.geojsonCSS插件。Geojson CSS以类似 css 的格式为集合中的每个功能提供样式定义。使用它需要事先在 geojson 中添加样式定义。

于 2016-03-13T19:48:04.597 回答