GithubHelp home page GithubHelp logo

crisisconsciousness / cesium-navigation-umd Goto Github PK

View Code? Open in Web Editor NEW

This project forked from worlddai/cesium-navigation-umd

0.0 0.0 0.0 6.61 MB

Cesium指南针、指北针、导航、navigation 插件。直接编译为umd。可以浏览器直接引用

JavaScript 74.75% CSS 25.25%

cesium-navigation-umd's Introduction

cesium-navigation-umd

这是一个基于cesium-navigation-es6 迁移的仓库。但是原作者仅提供es6 模式下的引用,需要npm 安装。我使用rollup重新编译了原作者的release。去掉了dev依赖。dist中内容为编译产物。可以直接引用。

demo在这里(受到带宽限制,加载可能略慢)

如果不能看,可以看原作者的

感谢原作者的源码。

原作者github主页

修改说明

  • CesiumNavigation.js

去掉了 dev模式下registerKnockoutBindings的依赖。

  • 所有依赖cesium.js的import

在src目录添加cesium文件夹。内部默认导出window.Cesium,所以打包生产的CesiumNavigation.umd.js 依赖Cesium环境,需要在html中手动引入

使用说明

  • 如果你的Cesium没有挂载在window下,那么修改src/cesium/Cesium.js,改为你对应的引用,然后运行npm run build

  • 在html文件中引用Cesium和Cesium必要样式表

  • 在html文件中引用CesiumNavigation.umd.jscesium-navigation.css

  • 初始化viewer 调用 CesiumNavigation.umd(viewer, options)

var viewer = new Cesium.Viewer('cesiumContainer', {
    imageryProvider: false,
    baseLayerPicker: false,
    timeline: false,
    infoBox: false,
    navigationHelpButton: false,
    fullscreenButton: false,
    animation: false,
    geocoder: false,
    homeButton: false,
    sceneModePicker: false
});


var options = {};

// 用于在使用重置导航重置地图视图时设置默认视图控制。接受的值是Cesium.Cartographic 和 Cesium.Rectangle.
options.defaultResetView = Cesium.Rectangle.fromDegrees(80, 22, 130, 50);
// 用于启用或禁用罗盘。true是启用罗盘,false是禁用罗盘。默认值为true。如果将选项设置为false,则罗盘将不会添加到地图中。
options.enableCompass = true;
// 用于启用或禁用缩放控件。true是启用,false是禁用。默认值为true。如果将选项设置为false,则缩放控件将不会添加到地图中。
options.enableZoomControls = true;
// 用于启用或禁用距离图例。true是启用,false是禁用。默认值为true。如果将选项设置为false,距离图例将不会添加到地图中。
options.enableDistanceLegend = true;
// 用于启用或禁用指南针外环。true是启用,false是禁用。默认值为true。如果将选项设置为false,则该环将可见但无效。
options.enableCompassOuterRing = true;



CesiumNavigation.umd(viewer, options);

编译说明

npm run build 

其他

本人博客,欢迎来这里提问或者讨论问题。

https://blog.csdn.net/qq_29722281

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.