Question

我想将系统从openlayers v3升级到openlayers v5，但是我遇到了问题。

在openlayers v3上，GeoJSON笔画完美连接。但是在openlayers v5上，GeoJSON笔划在瓷砖的边缘并不是理想的连接。

openlayers v3和v5之间是否存在与此问题相关的规范更改？还是我错过了重要的事情？

任何帮助和评论将不胜感激。

    <html>
      <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="http://openlayers.org/en/v3.8.2/css/ol.css" type="text/css">
        <script src="http://openlayers.org/en/v3.8.2/build/ol.js" type="text/javascript"></script>
        <script src="http://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script>
        <title>vector tile sample on openlayers3</title>
      </head>
      <body>
        <h2>vector tile sample on openlayers3</h2>
        <div id="map" class="map" style="width: 400px; height: 400px;"></div>
        <script type="text/javascript">
          var map = new ol.Map({
            target: 'map',
            controls: [],
            layers: [
              new ol.layer.Vector({
                source: new ol.source.TileVector({
                  format: new ol.format.GeoJSON(),
                  tileGrid: ol.tilegrid.createXYZ({minZoom: 16, maxZoom: 16}),
                  url: 'http://cyberjapandata.gsi.go.jp/xyz/experimental_railcl/{z}/{x}/{y}.geojson'
                }),
                style: new ol.style.Style({
                  stroke: new ol.style.Stroke({
                    color: 'green',
                    width: 7
                  })
                })
              }),
              new ol.layer.Tile({
                source: new ol.source.TileDebug({
                  projection: 'EPSG:3857',
                  tileGrid: (new ol.source.OSM()).getTileGrid()
                })
              }),
            ],
            view: new ol.View({
              center: ol.proj.transform([139.76, 35.682], 'EPSG:4326', 'EPSG:3857'),
              zoom: 16, maxZoom: 16, minZoom: 16
            })
          });
        </script>
      </body>
    </html>

    <html>
      <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="http://openlayers.org/en/v5.2.0/css/ol.css" type="text/css">
        <script src="http://openlayers.org/en/v5.2.0/build/ol.js" type="text/javascript"></script>
        <script src="http://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script>
        <title>vector tile sample on openlayers5</title>
      </head>
      <body>
        <h2>vector tile sample on openlayers5</h2>
        <div id="map" class="map" style="width: 400px; height: 400px;"></div>
        <script type="text/javascript">
          var map = new ol.Map({
            target: 'map',
            controls: [],
            layers: [
              new ol.layer.VectorTile({
                source: new ol.source.VectorTile({
                  format: new ol.format.GeoJSON(),
                  tileGrid: ol.tilegrid.createXYZ({minZoom: 16, maxZoom: 16}),
                  url: 'http://cyberjapandata.gsi.go.jp/xyz/experimental_railcl/{z}/{x}/{y}.geojson'
                }),
                style: new ol.style.Style({
                  stroke: new ol.style.Stroke({
                    color: 'green',
                    width: 7
                  })
                })
              }),
              new ol.layer.Tile({
                source: new ol.source.TileDebug({
                  projection: 'EPSG:3857',
                  tileGrid: (new ol.source.OSM()).getTileGrid()
                })
              })
            ],
            view: new ol.View({
              center: ol.proj.transform([139.76, 35.682], 'EPSG:4326', 'EPSG:3857'),
              zoom: 16, maxZoom: 16, minZoom: 16
            })
          });
        </script>
      </body>
    </html>

GeoJSON笔触不能理想地连接到openlayers 5的图块的边缘上

0 个答案: