qgc地面站如何导入离线地图_离线地图

导入KML源代码展示

body { margin: 0; padding: 0; }

#map { position: absolute; top: 0; bottom: 0; width: 100%; }

.tool{

position: absolute;

z-index: 10;

right: 10px;

top:15px;

}

.info{

position: fixed;

top:0;

color: #8a6d3b;

z-index: 99;

margin: 0;

background-color: #fcf8e3;

border-color: #faebcc;

left: 0;

right: 0;

text-align: center;

}

切换图层

数据保存在本地，刷新会消失，仅仅用作测试

导入KML

导出GeoJSON

BM.Config.HTTP_URL = 'http://www.bigemap.com:9000';

// 在ID为map的元素中实例化一个地图，并设置地图的ID号为 bigemap.baidu-map，ID号程序自动生成，无需手动配置，并设置地图的投影为百度地图 ，中心点，默认的级别和显示级别控件

var map = BM.map('map', 'bigemap.googlemap-satellite', {center: [ 30,104], zoom: 3, zoomControl: true,attributionControl:false});

//创建一个谷歌卫星图层 ，具体API详情请参见 ：http://www.bigemap.com/offlinemaps/api/#tilelayer

$('#upload').on('change',function () {

var file=this.files[0];

var extension=file.name.split('.');

extension=extension.pop();

if (extension!=='kml'){

alert('只能是KML格式');

return;

}

var reader=new FileReader();

reader.readAsText(file);

reader.οnlοad=function () {

var dom= (new DOMParser()).parseFromString(this.result, 'text/xml');

var geojsonFeature=toGeoJSON.kml(dom);

var blob=new Blob([JSON.stringify(geojsonFeature)]);

var href=URL.createObjectURL(blob);

$('#export').prop('href',href);

BM.geoJSON(geojsonFeature,{

style: function (feature) {

// return {color: feature.properties.stroke};

}

}).addTo(map);

}

});

$('#satellite').on('click',function () {

$('#upload').click();

});