在 Mapbox 或其他地图 SDK 上显示联运交通路线？

Question

我正在开发一个项目，需要显示任何给定城市的交通路线。我正在使用 Mapbox GL 库来渲染地图，尽管我还没有使用它。使用 Transitland 切片 API，我能够渲染城市的交通路线，尽管它的外观远非完美：

为了清楚起见，我隐藏了巴士路线。

是否可以使用 Mapbox GL 或其他库在任何缩放级别将“内联”路线（例如芝加哥环路中的路线）显示为平行的并排线？作为参考，以下是 Apple 地图中同一区域的示例：

如果有人看过我可以用作参考的示例，或者如果您知道可以完成此操作的方法，请告诉我！如果您想重新创建此地图，这里有一个片段，只需将开头的键替换为您自己的键即可：

const accessToken = MAPBOX_ACCESS_TOKEN;
const transitlandApiKey = TRANSITLAND_API_KEY;

map = new mapboxgl.Map({
  accessToken,
  container: 'map',
  style: 'mapbox://styles/mapbox/light-v11',
  center: [-87.6250549, 41.8786351],
  zoom: 13,
})

map.on('style.load', () => {

  // Add Transitland source
  map.addSource('routes', {
    type: 'vector',
    tiles: [
      `https://transit.land/api/v2/tiles/routes/tiles/{z}/{x}/{y}.pbf?apikey=${transitlandApiKey}`
    ],
    maxzoom: 14
  })

  map.addLayer({
    id: 'routes',
    type: 'line',
    source: 'routes',
    'source-layer': 'routes',
    layout: {
      'line-cap': 'round',
      'line-join': 'round',
    },
    paint: {
      'line-width': 2.0,
      'line-color': [
        'match',
        ['get', 'route_type'],
        0, // Tram, streetcar, light rail
        ['coalesce', ['get', 'route_color'], 'blue'],
        1, // Subway, metro
        ['coalesce', ['get', 'route_color'], 'red'],
        2, // Rail
        'red', // amtrak
        3, // Bus
        ['coalesce', ['get', 'route_color'], 'lightblue'], // busses
        'grey' // default
      ],
      'line-opacity': [
        'match',
        ['get', 'route_type'],
        0, // Tram, streetcar, light rail
        1,
        1, // Subway, metro
        1,
        2, // Rail
        1,
        0
      ]
    }
  })
})

<link href="https://api.mapbox.com/mapbox-gl-js/v2.14.1/mapbox-gl.css" rel="stylesheet"/>
<script src="https://api.mapbox.com/mapbox-gl-js/v2.14.1/mapbox-gl.js"></script>

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

Answer 1

您读过 Transit 的这篇博文吗？

https://blog.transitapp.com/how-we-built-the-worlds-prettiest-auto- generated-transit-maps-12d0c6fa502f/

可能是关于你的主题的最好的文章，尽管没有任何开源代码......

我也在寻找一个可以创建漂亮的 MapLibre 交通地图的库。看起来还没有这样的东西存在。