Openlayers结合TopoJson的简单使用


使用技术

  openlayers 6 ;Topojson ;转换TopoJson的网站 ;QGIS ;PostgreSQL

起因

  业务需求展示一个地区社区等界线不同年份的变换。从数据库调用数据太慢(一次查询需要2s,时间耗损在 st_asgeojson函数上。若有好的方法请指出),使用Geoserver发布地图年份多、单个shp数据量也不大,调试样式和发布太过繁琐得不偿失。考虑到加载速度并且数据不会修改只会新增,于是决定生成json文件保存在前端

GeoJson又太大就转换成TopoJson,文件大小从31MB左右缩小到了1MB左右。

解决方案大体流程

  1. 使用 QGIS将shp文件导入PostgreSQL并按照年份合并成一张表。(QGIS可以方便添加属性并统一赋值年份,然后创建总表,insert语句把所有年份表插入)
  2. 将表导出成shp文件,转换成TopoJson格式的json文件。
  3. openlayers读取json转换成feature进行展示。

关键点

  1. 注意坐标系和文件编码 
  2. 不知道为何读取json文件变成了Object,注意格式     new ol.format.TopoJSON().readFeatures(JSON.stringify(data));
GIS