vue中使用geobuf的示例详解

 更新时间:2022年04月08日 11:53:24   作者:~疆  
这篇文章主要介绍了vue中使用geobuf的示例详细,本文结合示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

需要安装geobuf和pbf这两个库

cnpm i -S geobuf pbf

引入

import geobuf from 'geobuf';
import Pbf from 'pbf';

使用:

    let geojson_multiPolygon = {
      type: 'Feature',
      properties: {},
      geometry: {
        type: 'MultiPolygon',
        coordinates: [
          [
            [
              [109.2041015625, 30.088107753367257],
              [115.02685546875, 30.088107753367257],
              [115.02685546875, 32.7872745269555],
              [109.2041015625, 32.7872745269555],
              [109.2041015625, 30.088107753367257]
            ]
          ],
          [
            [
              [112.9833984375, 26.82407078047018],
              [116.69677734375, 26.82407078047018],
              [116.69677734375, 29.036960648558267],
              [112.9833984375, 29.036960648558267],
              [112.9833984375, 26.82407078047018]
            ]
          ]
        ]
      }
    };
    let a = geobuf.encode(geojson_multiPolygon, new Pbf());
    console.log('序列化:', a);
 
    let b = geobuf.decode(new Pbf(a));
    console.log('反序列化:', b);

到此这篇关于vue中使用geobuf的文章就介绍到这了,更多相关vue 使用geobuf内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 基于 Vue.js 之 iView UI 框架非工程化实践记录(推荐)

    基于 Vue.js 之 iView UI 框架非工程化实践记录(推荐)

    为了快速体验 MVVM 模式,我选择了非工程化方式来起步,并选择使用 Vue.js,以及基于它构建的 iView UI 框架。本文给大家分享基于 Vue.js 之 iView UI 框架非工程化实践记录,需要的朋友参考下吧
    2017-11-11
  • 老生常谈Vue中的侦听器watch

    老生常谈Vue中的侦听器watch

    开发中我们在data返回的对象中定义了数据,这个数据通过插值语法等方式绑定到template中,这篇文章主要介绍了Vue中的侦听器watch,需要的朋友可以参考下
    2022-10-10
  • Vue实现图片验证码生成

    Vue实现图片验证码生成

    这篇文章主要为大家详细介绍了Vue实现图片验证码生成,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-03-03
  • Vue.js中的图片引用路径的方式

    Vue.js中的图片引用路径的方式

    当我们在Vue.js项目中引用图片时,关于图片路径有以下几种情形,下面通过本文给大家分享Vue.js中的图片引用路径的方式,感兴趣的朋友一起看看吧
    2017-07-07
  • 解决vue prop传值default属性如何使用,为何不生效的问题

    解决vue prop传值default属性如何使用,为何不生效的问题

    这篇文章主要介绍了解决vue prop传值default属性如何使用,为何不生效的问题。具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-09-09
  • vite vue3下配置history模式路由的步骤记录

    vite vue3下配置history模式路由的步骤记录

    路由存在两者模式,一种是历史模式history,一种是hash模式,下面这篇文章主要给大家介绍了关于vite vue3下配置history模式路由的相关资料,需要的朋友可以参考下
    2023-01-01
  • Element el-table的formatter和scope template不能同时存在问题解决办法

    Element el-table的formatter和scope template不能同时存在问题解决办法

    本文主要介绍了ElementUI el-table 的 formatter 和 scope template 不能同时存在问题解决办法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-08-08
  • element-vue实现网页锁屏功能(示例代码)

    element-vue实现网页锁屏功能(示例代码)

    这篇文章主要介绍了element-vue实现网页锁屏功能,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
    2023-11-11
  • 图文详解如何在vue3+vite项目中使用svg

    图文详解如何在vue3+vite项目中使用svg

    SVG指可伸缩矢量图形,用来定义用于网络的基于矢量的图形,下面这篇文章主要给大家介绍了关于如何在vue3+vite项目中使用svg的相关资料,需要的朋友可以参考下
    2021-11-11
  • mpvue小程序循环动画开启暂停的实现方法

    mpvue小程序循环动画开启暂停的实现方法

    这篇文章主要介绍了mpvue小程序循环动画开启暂停的实现方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-05-05

最新评论