![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
Devin·Finn
✍择一事,终一生,不为繁华易匠心。
展开
-
空间查询、属性查询
效果图空间查询:框选查询结果:属性查询:源码<template> <div id="home"> <!--面包屑导航区域--> <el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb-item :to="{ path: '/home' }">Home</el-breadcrumb-item> <原创 2021-05-11 21:05:36 · 768 阅读 · 0 评论 -
基于Vue的GIS组件GISView的API文档
GISView API基于Vue的GIS组件版本:1.2.12021.04.28npm传送门CSDN起步初始化vue项目vue tese demo安装组件库npm install gisviewpackpage.json"dependencies": { "@geoman-io/leaflet-geoman-free": "^2.10.0", "@supermap/iclient-leaflet": "^10.1.2", "core-js"原创 2021-04-28 16:17:47 · 1670 阅读 · 8 评论 -
Vue开发过程中的小问题
动态渲染的组件样式需要动态引入。原创 2021-04-25 21:59:44 · 152 阅读 · 0 评论 -
vue + @supermap/iclient-leaflet 加载切片出现未定义错误
问题如图:解决参考超图技术社区的帖子,重新安装了好几遍,还是没有解决。分析之后,调试一番,我想是因为调用自己的组件的时候还没有引用超图的组件。修改了调用顺序之后完美解决关于小伙伴们重新安装若干次后成功,我觉得应该是打包,异步加载的原因...原创 2021-04-17 12:28:17 · 645 阅读 · 2 评论 -
(完美解决~)关于Vue+Leaflet添加market时,图片不显示的问题
解决重新引用一下icon,这样做的问题是引用的图片,默认点位和图片的左上角重合,会有偏移量。通过设置iconAnchor,改变偏移量[icon长的一半,宽],这样默认icon的角点和坐标的偏移量会缩小到2px内。要去精度高的需要在调一调原创 2021-04-14 17:24:51 · 3304 阅读 · 3 评论 -
[Vue bug记录] 关于Vue ui打开控制面板的时候,遇到GUI卡住没有自动弹出管理器
问题:Vue ui打开控制面板的时候,卡在这个界面解决在你cmd打开的默认目录下输入explorer %cd%,打开.vuerc文件(记事本或者文本编辑器都可以),把第一个使用淘宝镜像的设置改为true原创 2021-02-24 17:14:23 · 619 阅读 · 0 评论 -
Vue环境的配置及语法检查(VsCode)
吐槽一下,可以下滑直接正文我的webstorm又双叒叕的不能用了,都已经频繁到每日激活码了,还是给我封封封的。听说可以申请教育版,但是貌似我们学校不可以,就很气。好吧,转战VsCode。不是说VsCode不香,因为平时工作的环境用的vscode,vue的项目格式化的配置又不同于工作中的要求,加上vue的学习习惯,博主果断选择双环境,最后还是没能抗住贫穷。改用Vscode,少不了配置一波。幸好vue初始化项目的配置文件很完整,只需要做一些改动就可以。正文:安装插件。参考各位大佬的博客,装了Es原创 2021-02-19 10:06:14 · 1482 阅读 · 0 评论 -
v-model语法糖在vue组件开发中的传值问题
v-model语法糖在vue组件开发中的传值问题给组件使用v-model指令,实质上相当于给组件传递了value属性以及监听了input事件<xx-input v-model="active">等价与<xx-input :value="active" @input="value => { active= value }"/>所以在子组件中接受v-model传过来的值的时候,props中的名称必须为value,并且返回值到父组件的时候this.$emit('inpu原创 2021-02-16 14:10:45 · 389 阅读 · 0 评论 -
echarts绘制map,添加图表,符合ES6规范
效果图1. template结构<template> <div class="wrap" style="position: relative; width: 100%"> <div id="map" style="width: 100%; height: 835px;"></div> </div></temp...原创 2020-05-02 19:33:32 · 1067 阅读 · 2 评论 -
Vue加载Amd模块(echarts的省市json)
Vue不支持Amd多的暴露方式。会报各种not define的错误解决方式删掉Amd暴露的代码。使用vue的向外暴露的代码。将需要暴露的代码块拿出来,在Vue组件中引用即可这里以echarts的北京市json为例说明打开beijing.js,内容如下所示其中已经标明数据,红框是将后面的json数据绘制成为echarts地图。并通过外层的代码块使用Amd规范向外暴露将数据部分提...原创 2020-05-02 19:13:17 · 1730 阅读 · 0 评论 -
Vue + ArcGIS API自学笔记
Vue 与 ArcGIS API 结合,基于Vue-cli 和 Esri loader 学习笔记下方链接,关注可见2020.3.19更3.x加载 arcgis server 地图服务4.x加载 arcgis server 地图服务2020.03.28更实时同步范围+坐标小部件图层控制 + 筛选设置范围+坐标2020.04.11更书签+图层列表+测量工具+图例+鹰...原创 2020-05-01 23:10:44 · 1241 阅读 · 2 评论 -
唯一值渲染、简单渲染、分级渲染、热力图渲染(完整源码实现)
效果图系统中进行了简单封装和提示信息,不需要可以直接删掉,单独成块,不会影响功能。源码<template> <div id="home"> <!--面包屑导航区域--> <el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcru...原创 2020-05-01 23:07:04 · 1743 阅读 · 0 评论 -
几何处理-绘图(点,多点,线,箭头线,面,徒手线,徒手面,圆,矩形)
效果图几何处理结合api,每一种几乎改动不大。源码<template> <div id="home"> <!--面包屑导航区域--> <el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb-item :to="{ path:...原创 2020-04-11 11:00:41 · 717 阅读 · 0 评论 -
书签+图层列表+测量工具+图例+鹰眼+地图切换
效果图1. 书签 // 书签 var bookmarksList = [ { extent: { xmin: 106, ymin: 39, xmax: 112, ymax: 32 }, name: '陕西' }, { extent: { xmin: 111, ymin: 31, xmax: 117, ymax: 35 },...原创 2020-04-11 10:55:25 · 676 阅读 · 0 评论 -
Vue + ArcGIS api 实时同步范围+坐标
修改中心坐标需要是地理坐标系功能ID函数同步范围#extent-changeshowExtent同步坐标‘#MouseMove’showCoordinates变量含义extent_tag绑定范围的显示标签xyText绑定坐标的显示标签extent_zdy修改范围的值xy_zdy修改XY的值 mou...原创 2020-03-28 05:22:37 · 1146 阅读 · 1 评论 -
Vue + ArcGIS api 设置范围+坐标
修改中心坐标需要是地理坐标系功能ID函数控制修改中心坐标的Dialog的显示#setting-extent-xydialogSetXYVisible实现修改中心坐标‘#XYDialogOK’btnSettingXY控制修改范围的Dialog的显示#setting-extentdialogSetExtentVisible实现修改范围‘#ex...原创 2020-03-28 05:15:23 · 1133 阅读 · 0 评论 -
esri loader + arcgis api 图层控制 + 筛选
功能ID筛选#option-choose清除筛选#option-clean显示隐藏控制#option-visible筛选函数中的layerDefinitoin控制筛选条件js部分// 我们需要在该组件装载之后做的事情都放在该方法里 mounted() { esriLoader.setDefaultOptions({ version: '3...原创 2020-03-28 05:03:15 · 1215 阅读 · 0 评论 -
esri loader + arcgis api 实现小部件
template部分<template> <el-row style="box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 12px 0px;"> <el-button type="" icon="el-icon-plus" circle class="zoomin"></el-button>...原创 2020-03-28 04:54:10 · 890 阅读 · 1 评论 -
esri loader + Arcgis api 4.x加载 arcgis server 地图服务
默认是加载4.x的api在线连接。1. template部分<template> <div></div></template>2. 导包部分 js和css自动导入最新版,所以不用再导入loadScript和loadCssimport { loadModules } from 'esri-loader'3. export接口部分e...原创 2020-03-19 17:50:23 · 1495 阅读 · 0 评论 -
esri loader + Arcgis api 3.x加载 arcgis server 地图服务
默认是加载4.x的api在线连接。使用3.x的api需要手动调用链接。1. template部分,需要绑定id,和纯js的相同<template> <div id="map"></div></template>2. 导包部分import { loadScript, loadCss, loadModules } from 'esri-l...原创 2020-03-19 17:43:59 · 1530 阅读 · 0 评论 -
github/码云操作---提交中的常用命令
将login分支中的代码提交到本地仓库,合并到master分支推送到远端git status:查看当前项目中源代码的状态git add .:将修改后文件和新增文件添加到暂存区git commit -m "提交的文本说明信息":提交暂存区代码到本地仓库git branch:查看分支git checkout master:切换分支到mastergit merge login:合并分支g...原创 2020-01-09 12:22:16 · 251 阅读 · 0 评论 -
Vue工程化环境(模块化规范、webpack、单文件组件、脚手架、Element-UI)
Vue工程化1,模块化相关规范**1. 浏览器端模块化规范 **1.1 AMDRequire.js (http://www.requirejs.cn/)1.2 CMDSea.js (https://seajs.github.io/seajs/docs/)2. 服务器端模块化规范2.1 CommonJS分为 单文件模块、包导出:module.exports和exports导入...原创 2019-12-07 21:23:51 · 346 阅读 · 0 评论