Mapbox Tile Layer 中的街道标签太小

Question

我有以下传单地图：JSFiddle link

<div id="mapid" style="height: 300px;"></div>

<script>
  var mapboxTiles = L.tileLayer(mapBoxUrl, {
    attribution: attributionText
  });

  var map = L.map('mapid')
    .addLayer(mapboxTiles)
    .setView([42.888284, -78.877222], 16);

</script>

街道标签的字体非常小，难以辨认，放大后字体变小。有没有办法控制字体大小？

Answer 1

看起来您有 512 像素大小的图块，但在绘制地球时好像它们是 256 像素大小的。

因此，您需要在图块层上组合 tileSize and zoomOffset 选项来补偿这些设置，并在图块上检索具有可读大小文本的正确视图：

var mapboxTiles = L.tileLayer(mapBoxUrl, {
  attribution: '© <a href="https://www.mapbox.com/map-feedback/">Mapbox</a> © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
  tileSize: 512,
  zoomOffset: -1
});

已更新 JSFiddle：https://jsfiddle.net/zq02pnpg/2/

Answer 2

我也有这个问题。就我而言，地图在桌面上呈现得很好，但在移动设备上，它（字体大小）变得非常小且不可读。我尝试将图块大小和缩放偏移量加倍，但效果很好。

var mapboxTiles = L.tileLayer(mapBoxUrl, {
  attribution: '© <a href="https://www.mapbox.com/map-feedback/">Mapbox</a> © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
  tileSize: 1024,
  zoomOffset: -2
});

我不确定这是否属于任何形式的违规行为，但它对我有用！

Mapbox Tile Layer 中的街道标签太小

Street labels in Mapbox Tile Layer too small

leaflet

mapbox