R 的传单:如何自定义簇的着色?
Leaflet for R: How to customize the coloring of clusters?
如何在 R 的传单包中自定义 addMarkers 函数的颜色?
簇的默认颜色是:
- 1-10 绿色
- 11-100 黄色
- 100+ 红色
我想将范围和颜色更改为:
- 1-100 红色
- 101-1000 黄色
- 1000+ 绿色
JS Leaflet 具有以下功能:
https://github.com/Leaflet/Leaflet.markercluster#customising-the-clustered-markers
这可以通过 R 包中的 markerClusterOptions 参数实现吗?
leaflet(quakes) %>% addTiles() %>% addMarkers(
clusterOptions = markerClusterOptions()
)
您可以使用 markerClusterOptions
中的 iconCreateFunction
创建您自己的自定义图标功能来显示集群标记。
在您的示例中,您也许可以只修改默认标记函数(已找到 here) and just modify the if/else loops setting the CSS class of the markers. The default CSS that colors the markers can be found here。如果您想要更多自定义,可以创建自己的 类。
这是一个代码示例(大号是红色,中号是黄色,小号是绿色,所以我只是切换了默认代码以符合您的条件):
library(leaflet)
leaflet(quakes) %>% addTiles() %>% addMarkers(
clusterOptions = markerClusterOptions(iconCreateFunction=JS("function (cluster) {
var childCount = cluster.getChildCount();
var c = ' marker-cluster-';
if (childCount < 100) {
c += 'large';
} else if (childCount < 1000) {
c += 'medium';
} else {
c += 'small';
}
return new L.DivIcon({ html: '<div><span>' + childCount + '</span></div>', className: 'marker-cluster' + c, iconSize: new L.Point(40, 40) });
}"))
)
如何在 R 的传单包中自定义 addMarkers 函数的颜色?
簇的默认颜色是:
- 1-10 绿色
- 11-100 黄色
- 100+ 红色
我想将范围和颜色更改为:
- 1-100 红色
- 101-1000 黄色
- 1000+ 绿色
JS Leaflet 具有以下功能: https://github.com/Leaflet/Leaflet.markercluster#customising-the-clustered-markers
这可以通过 R 包中的 markerClusterOptions 参数实现吗?
leaflet(quakes) %>% addTiles() %>% addMarkers(
clusterOptions = markerClusterOptions()
)
您可以使用 markerClusterOptions
中的 iconCreateFunction
创建您自己的自定义图标功能来显示集群标记。
在您的示例中,您也许可以只修改默认标记函数(已找到 here) and just modify the if/else loops setting the CSS class of the markers. The default CSS that colors the markers can be found here。如果您想要更多自定义,可以创建自己的 类。
这是一个代码示例(大号是红色,中号是黄色,小号是绿色,所以我只是切换了默认代码以符合您的条件):
library(leaflet)
leaflet(quakes) %>% addTiles() %>% addMarkers(
clusterOptions = markerClusterOptions(iconCreateFunction=JS("function (cluster) {
var childCount = cluster.getChildCount();
var c = ' marker-cluster-';
if (childCount < 100) {
c += 'large';
} else if (childCount < 1000) {
c += 'medium';
} else {
c += 'small';
}
return new L.DivIcon({ html: '<div><span>' + childCount + '</span></div>', className: 'marker-cluster' + c, iconSize: new L.Point(40, 40) });
}"))
)