【问题标题】:Why can't I add graticule to my polar stereo map? (OpenLayers 4)为什么我不能在我的极地立体地图中添加经纬网? (OpenLayers 4)
【发布时间】:2018-06-08 19:45:34
【问题描述】:

我正在使用投影 EPSG:32661 在 OpenLayers 4 中制作地图

这是 JavaScript,它以页面上的 #map div 为目标:

proj4.defs('EPSG:32661', '+proj=stere +lat_0=90 +lon_0=0 +k=1 +x_0=0 +y_0=0 
+a=3396190 +b=3376200 +units=m +no_defs');
var north_stereo = ol.proj.get('EPSG:32661');
north_stereo.setExtent([-2357032, -2357032, 2357032, 2357032]);
var npoleURL = "https://planetarymaps.usgs.gov/cgi-bin/mapserv? 
map=/maps/mars/mars_npole.map";

var np = new ol.layer.Tile({
    title: 'North Pole',
    source: new ol.source.TileWMS({
        url: npoleURL,
        params: {LAYERS: 'MOLA_color_north'}
    }),
    projection: north_stereo,
});

var map = new ol.Map({
    layers: [
        np
    ],
target: 'map',
view: new ol.View({
    projection: north_stereo,
    center: [0, 0],
    zoom: 4
  })
});
var graticule = new ol.Graticule({
    strokeStyle: new ol.style.Stroke({
        color: 'rgba(0,0,0,0.8)',
        width: 1,
    }),
});
graticule.setMap(map);

This CodePen 演示了我遇到的问题。注释掉最后一行,也就是将标线附加到地图的那一行,会导致地图正常渲染。使用该行运行代码会导致以下错误:

Uncaught TypeError: Cannot read property '0' of null
at Object.ol.extent.applyTransform (ol-debug.js:4719)
at Object.ol.proj.transformExtent (ol-debug.js:6268)
at ol.Graticule.updateProjectionInfo_ (ol-debug.js:57921)
at ol.Graticule.handlePostCompose_ (ol-debug.js:57876)
at ol.Map.boundListener (ol-debug.js:7277)
at ol.Map.ol.events.EventTarget.dispatchEvent (ol-debug.js:7697)
at ol.renderer.canvas.Map.dispatchComposeEvent_ (ol-debug.js:26392)
at ol.renderer.canvas.Map.renderFrame (ol-debug.js:26480)
at ol.Map.ol.PluggableMap.renderFrame_ (ol-debug.js:18709)
at ol.Map.<anonymous> (ol-debug.js:17624)

据我了解 proj4 会自动生成转换函数。转换点或要素图层已经成功,据我所知,唯一造成麻烦的就是经纬网。

【问题讨论】:

    标签: javascript openlayers


    【解决方案1】:

    错误是因为没有定义worldExtent,设置这个应该可以解决问题

    north_stereo.setWorldExtent([...]);
    

    【讨论】:

    • 极坐标投影上出现了标线!它仍然不能完美地工作 - 例如,当我移动视图时,它会改变刻度线的长度,它应该延伸到整个视口而目前没有,但这可能是我需要在我的结束,当我为将来发现此问题的任何人弄清楚时,我会用另一条评论进行更新。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-11-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-04-03
    相关资源
    最近更新 更多