如何在openLayer地图中加载本地gpx文件? [英] How load local gpx file in a openLayer map?

查看:281
本文介绍了如何在openLayer地图中加载本地gpx文件?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我认为标题不是很清楚,我正在使用openLayer库(v4.6.5),并且试图在加载页面时在地图中加载本地GPX文件.在官方文档的GPX数据示例中( https://openlayers. org/zh-CN/latest/examples/gpx.html?q = data )似乎很容易处理网址.

I think than the title is pretty clear, I am using openLayer library(v4.6.5) and I am trying to load a local GPX file in my map when the page is loaded. In the official documentation, in GPX Data example (https://openlayers.org/en/latest/examples/gpx.html?q=data) that seems to be pretty straightforward to do with an url.

var vector = new ol.layer.Vector({
    source: new ol.source.Vector({
      url: 'https://openlayers.org/en/v4.6.5/examples/data/gpx/fells_loop.gpx',
      format: new ol.format.GPX()
    }),
    style: function(feature) {
      return style[feature.getGeometry().getType()];
    }
  });

我的问题是,需要设置ol.source.Vector对象中的哪个选项来加载本地GPX文件,而不是设置url选项?预先感谢.

My question is, instead of setting url option, what option I need to set in ol.source.Vector object to load a local GPX file? Thanks in advance.

推荐答案

解决方案1 ​​

只需使用拖动&放置在OpenLayers库中提供的组件.演示于 https://openlayers.org/en/latest/examples/drag- and-drop.html (拖放GPX进行测试)

Just use the drag & drop component provided within OpenLayers library. Demo at https://openlayers.org/en/latest/examples/drag-and-drop.html (drag and drop a GPX to test)

解决方案2

如果您想/需要手动操作,则需要删除URL引用和格式.

If you want/need to do things manually, you need to remove the URL reference and the format.

然后,通过拖放(或其他操作)然后使用进行解析,您将获得GPS文件内容

Then, you get GPS file content when you do a drag and drop (or another action) then parse it with

var GPXfeatures = (new ol.format.GPX()).readFeatures('yourGPXstring', {featureProjection: 'EPSG:3857'})

然后您使用

vector.getSource().addFeatures(GPXfeatures)

这篇关于如何在openLayer地图中加载本地gpx文件?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆