在vue中使用WKT坐标转换为GeoJSON坐标的详细方法

安腾斯科技

已于 2024-08-20 09:26:21 修改

阅读量133

点赞数 2

文章标签： javascript 前端开发语言

于 2024-08-12 09:13:07 首次发布

本文链接：https://blog.csdn.net/2301_81431930/article/details/141122277

版权

wkt一种用于表示地理空间数据的文本格式

Point (点)

POINT(-122.085 37.422)

Polygon (多边形)

POLYGON((-122.085 37.422, -122.082 37.425, -122.085 37.425, -122.085 37.422))

MultiPoint (多点)

MULTIPOINT((-122.085 37.422), (-122.082 37.425))

MultiLineString (多线串)

MULTILINESTRING((-122.085 37.422, -122.082 37.425), (-122.082 37.425, -122.080 37.428))

MultiPolygon (多边形集合)

MULTIPOLYGON(
  ((-122.085 37.422, -122.082 37.425, -122.085 37.425, -122.085 37.422)),
  ((-122.080 37.425, -122.080 37.428, -122.082 37.428, -122.080 37.425))
)

转换为GeoJSON坐标

1.安装依赖库

npm install @turf/helpers wellknown

2.Vue代码中使用

<script>
import { feature } from '@turf/helpers';
import wellknown from 'wellknown';

export default {
  data() {
    return { wkt: '',
      geojson: ''
    }; },
  methods: {
    convertToGeoJSON() {
      try {
        // 使用 wellknown 将 WKT 转换为 GeoJSON 几何对象
        const geometry = wellknown(this.wkt);
        
        // 使用 @turf/helpers 创建 GeoJSON 特征
        const geojsonFeature = feature(geometry);
        
        // 设置结果为 GeoJSON 特征
        this.geojson = JSON.stringify(geojsonFeature, null, 2); // 格式化输出
      } catch (error) {
        console.error('Error converting WKT to GeoJSON:', error);
        this.geojson = 'Invalid WKT format.';
      }
    }
  }
};
</script>

3.解析