博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
基于vue框架的cesium开发
阅读量:4342 次
发布时间:2019-06-07

本文共 1861 字,大约阅读时间需要 6 分钟。

1.安装Cesium开发环境(不能直接引入啦)npm install cesium //多试几次,因为没有翻墙的原因,各种麻烦2.安装完后,进入node_modules\cesium\Build文件夹中,把编译好的Cesium文件复制到根目录下的static文件夹中,里面应该是有四个文件夹,整个一起复制过去,把Cesium.js删除3.在build/webpack.base.conf.js中的output中加入sourcePrefix: ' ',让Webpack正确缩进多行字符串。(直接加在最后就好啦,记得前面加上逗号)4.在build/webpack.base.conf.js下的module中加入unknownContextCritical: false,5.在build/webpack.base.conf.js下的module中加入unknownContextRegExp: /^.\/.*$/,/* module: { rules: [ ..... ], unknownContextRegExp: /^.\/.*$/, unknownContextCritical: false } */OK,前面都配置好了,基本上可以使用了。main.js中引入:import Viewer from 'cesium/Source/Widgets/Viewer/Viewer'import Cesium from 'cesium/Source/Cesium' (这可是我自己找到,哼哼)import buildModuleUrl from "cesium/Source/Core/buildModuleUrl"import 'cesium/Source/Widgets/widgets.css'这样就能全局使用了在你的组件中写方法:mounted:function(){this.buildModuleUrl.setBaseUrl('../static/js/Cesium'); /*这个必须有,不然找不到你的组件哦 */this.viewer = new this.Viewer('cesiumContainer',{ terrainProvider: new this.Cesium.CesiumTerrainProvider({ url: "http://assets.agi.com/stk-terrain/world", requestWaterMask: true, requestVertexNormals: true }), imageryProvider: new this.Cesium.UrlTemplateImageryProvider({ url: "http://mt1.google.cn/vt/lyrs=s&hl=zh-CN&x={x}&y={y}&z={z}&s=Gali" }), geocoder: false, //搜索 homeButton: false, //主页 地球回正 sceneModePicker: false, //地球平铺 网格 3d/2d选择器 baseLayerPicker: false, animation: false, //是否创建动画小器件,左下角仪表 selectionIndicator: false, fullscreenButton: false, infoBox: false, navigationHelpButton: false, //是否显示右上角的帮助按钮 timeline: false, baseLayerPicker: false //图层选择器});}OJBK,这样,你的容器中的地球就可以出来了!!!!!还有还有,把cesium的源码封装一下吧,容易自己调用首先:我是在assets文件夹中创建了一个js文件夹,自己写一个js 取名随意,反正到时候可以设置名称export function xxx(xxxx){...}在最下面export default:{xxx}最后,在你的组件中引用一下 就OJBK了!!!完美新手vue ,说的不对大佬指教。

 

转载于:https://www.cnblogs.com/bfc666/p/9374365.html

你可能感兴趣的文章
第43条:掌握GCD及操作队列的使用时机
查看>>
Windows autoKeras的下载与安装连接
查看>>
CMU Bomblab 答案
查看>>
微信支付之异步通知签名错误
查看>>
2016 - 1 -17 GCD学习总结
查看>>
linux安装php-redis扩展(转)
查看>>
Vue集成微信开发趟坑:公众号以及JSSDK相关
查看>>
技术分析淘宝的超卖宝贝
查看>>
i++和++1
查看>>
react.js
查看>>
P1313 计算系数
查看>>
NSString的长度比较方法(一)
查看>>
Azure云服务托管恶意软件
查看>>
My安卓知识6--关于把项目从androidstudio工程转成eclipse工程并导成jar包
查看>>
旧的起点(开园说明)
查看>>
生产订单“生产线别”带入生产入库单
查看>>
crontab导致磁盘空间满问题的解决
查看>>
java基础 第十一章(多态、抽象类、接口、包装类、String)
查看>>
Hadoop 服务器配置的副本数量 管不了客户端
查看>>
欧建新之死
查看>>