npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@mapgis/webclient-vue-cesium

v17.2.2

Published

mapgis webclient-vue-cesium

Downloads

504

Readme

Webclient-Vue-Cesium


简介

webclient-vue-cesium 是基于 Cesium 的 vue 组件开发库,提供构建 Web 三维 GIS 应用的常用 vue 组件。

模块说明

模块说明

特点

  • 组件式风格

通过 Vue 的组件方式调用 layers, markers, popups, 并且使用同步 props synchronized props 来控制状态

  • Vue 控制

面向对象编程:地图元素拥有 Vue 的生命周期,将原生地图事件封装成 Vue 的事件


安装

npm install --save @mapgis/webclient-vue-cesium
# 或者
yarn add @mapgis/webclient-vue-cesium

在 main.js 中全局引入组件

import "@mapgis/webclient-vue-ui/dist-libs/webclient-vue-ui.css";
import "@mapgis/webclient-vue-cesium/dist-libs/webclient-vue-cesium.css";

import MapgisUi from "@mapgis/webclient-vue-ui";
import Mapgis3d from "@mapgis/webclient-vue-cesium";

Vue.use(MapgisUi);
Vue.use(Mapgis3d);

cesium 库引入

webclient-vue-cesium 依赖 @mapgis/cesium,安装@mapgis/webclient-vue-cesium的时候会自动安装依赖@mapgis/cesium@mapgis/cesium的包结构展示如下:

代码结构

请将上述 cesium 目录拷贝到你的 vue 工程的 public 静态资源文件夹中,记录以下两个文件的路径:

# 主Cesium主体路径
public/cesium/dist/Cesium.js
# Cesium拓展插件路径
public/cesium/dist/webclient-cesium-plugin.min.js

通过在浏览器中 访问 http://localhost:xxxx/cesium/dist/Cesium.js 成功即可。

WebClient-Vue-Cesium 组件使用以上两个文件的方式如下所示:

<template>
  <mapgis-web-scene
    ref="webgloberef"
    libPath="cesium/dist/Cesium.js"
    pluginPath="cesium/dist/webclient-cesium-plugin.min.js"
  >
    <mapgis-3d-igs-tile-layer />
  </mapgis-web-scene>
</template>

这里在 mapgis-web-scene 组件初始化的时候就需要传入libPath以及pluginPath 如果不传入则从司马云上自动下载对应的网络地址,没有互联网则无法下载。


相关链接


项目依赖