0

私は PGRestAPI からの独自のベクター タイルを持っています。以下のような URLです

mapbox-gl.js を使用してマップをレンダリングしようとしましたが、何も表示されません。

私は間違っていますか?どうも

var style = {
  "version": 8,
  "sources": {
    "countries": {
      "type": "vector",
      "tiles": ["http://192.168.1.4:3001/services/postgis/cleantech2/geom/vector-tiles/{z}/{x}/{y}.pbf"],
      "maxzoom": 6
    }
  },
  "glyphs": location.origin+location.pathname+"font/{fontstack}/{range}.pbf",
  "layers": [{
    "id": "background",
    "type": "background",
    "paint": {
      "background-color": "#ddeeff"
    }
  },{
    "id": "country-glow-outer",
    "type": "line",
    "source": "countries",
    "source-layer": "country",
    "layout": {
      "line-join":"round"
    }
  }]
};

var init_lat = 1.3552799//42.299228067198634;
var init_lng = 103.6945413;//-83.69717033229782;
  mapboxgl.accessToken = 'mapbox-token';
  var map = new mapboxgl.Map({
      container: 'map',
      style: style,
      center: [init_lng,init_lat],
      zoom: 15
  });

編集1:

mapbox-gl-js コードをデバッグした後、いくつかの円が表示されるようになりました。スタイルを変更します。pbf からのソース レイヤー名は正しい必要があります。

すべてのポイントを表示していませんが、フィルタリングされているようですか?

まばらな円

var style = {
        "version": 8,
        "sources": {
            "cleantech": {
                "type": "vector",
                // "url": "mapbox://map-id"
                // "url": "http://tileserver.com/layer.json",
                "tiles": ["http://192.168.1.4:3001/services/postgis/cleantech2/geom/vector-tiles/{z}/{x}/{y}.pbf"],
                "maxzoom": 6
            }
        },
        "glyphs": location.origin+location.pathname+"font/{fontstack}/{range}.pbf",
        "layers": [{
            "id": "cleantech2_geom_id",
            "type": "circle",
            'source': 'cleantech',
            'layout': {
                'visibility': 'visible'
            },
            'paint': {
                'circle-radius': 8,
                'circle-color': 'rgba(55,148,179,1)'
            },
            'source-layer': 'cleantech2_geom'
        }]
    };

編集 2: maxzoom を 22 に変更し、すべてのデータを表示します。飲もう!

4

0 に答える 0