VUE CESIUM

Vue 2.x components for CesiumJS. Load Cesium built package or other third-party packages which are built on Cesium.

Languages

• 中文
• English

Links

• Documentation
• Official Demo
• More examples

Get Start

VueCesium using the built CesiumJS library. You can use online, local, official native libraries or third-party libraries built on Cesium depending on your project needs. The SuperMap iClient 3D for WebGL and the EarthSDK of CesiumLab have been tested.

Developed components.

In the gradual improvement...

Installation

npm i --save vue-cesium

Usage

import Vue from 'vue'
import VueCesium from 'vue-cesium'
import lang from 'vue-cesium/lang/zh-hans'
// import lang from 'vue-cesium/lang/en-us'
Vue.use(VueCesium)
// or
// Vue.use(VueCesium, {
//   // cesiumPath is path of Cesium.js', for example:
//   // local Cesium Build package:
//   // cesiumPath: '/static/Cesium/Cesium.js'
//   // Online Cesium Build package：
//   // cesiumPath: 'https://zouyaoji.top/vue-cesium/statics/Cesium/Cesium.js'
//   // cesiumPath: 'https://cdn.jsdelivr.net/npm/cesium@latest/Build/Cesium/Cesium.js',
//   // cesiumPath: 'https://unpkg.com/cesium/Build/CesiumUnminified/Cesium.js',
//   // cesiumPath: 'https://unpkg.com/cesium@latest/Build/Cesium/Cesium.js',
//   cesiumPath: 'https://unpkg.com/cesium/Build/Cesium/Cesium.js',  // default
//   accessToken: `Your accessToken`,
//   lang: lang // 2.0.3+ //  zh-hans
// })

<template>
  <div class="viewer">
    <vc-viewer></vc-viewer>
  </div>
</template>

<style>
  .viewer {
    width: 100%;
    height: 400px;
  }
</style>

Contributing

Contributing Guide

License

MIT License

Copyright (c) 2018-present, zouyaoji [email protected]

Donate

Your support is the driving force for me to move forward and better support the open source cause! ~

• PayPal

  

• WeChat

  

• AliPay

  

QQGroup

16533444

Reference

Two good vue components projects: vue-baidu-map and vuelayers.