- 博客(31)
- 收藏
- 关注
RSS订阅原创 vue分页组件封装
1、page.vue组件<template> <div class="greenpage"> <!-- :layout="layout" --> <el-pagination :background="background" :current-page.sync="currentPage" :page-size.sync="pageSize" :page-sizes="pageSizes"
2022-05-26 10:26:47
669
原创 数组相关函数
1、es6----includes()方法–返回true和false1）第一个参数是要查找的元素2）第二个参数表示搜索的起始位置，默认为 0 。如果第二个参数为负数，则表示倒数的位置，如果这时它大于数组长度（比如第二个参数为 -4 ，但数组长度为 3 ），则会重置为从 0 开始。只有一个参数情况[1, 2, 3].includes(2); // true [1, 2, 3].includes(4); // false [1, 2, NaN].includes(NaN); // true
2022-03-11 20:12:59
116
原创 vue项目节流/防抖函数的使用
1、使用lodash（throttle --节流，debounce—防抖），按需引入import throttle from 'lodash/throttle';2、方法里函数不能使用箭头函数（每两秒出发一次）changeIndex:throttle(function(index){ this.currentindex = index;},2000),...
2022-03-09 15:21:43
1242
原创 快速创建uniapp项目
1，下载HBulider2、下载雷电模拟器43、安装插件npm install4、安装模拟器基座，并运行（模拟器调成手机模式）
2022-01-15 13:19:57
149
原创 map区域合并
1、合并数据，在 http://geojson.io/#new 上传需要合并的json文件2、 将右侧数据复制出来，另存为json文件3、修改该json文件，目前得到数据如下，features数组对象下，每个对象的properties增加alias属性，属性值为合并后名字。保存4、打开https://mapshaper.org/，选择刚上传的json文件导入，得到如下数据5、打开网站命令行工具，输入命令 dissolve ‘alias’ -o result.json，回车，然后下载json文件6
2022-01-10 11:07:13
1152
原创 两个数组里面的对象元素根据相同的id合并到一个数组
let arr=[{id:1,name:'dylan'},{id:2,name:'kebi'}]let arr1=[{id:1,position:'ceo'},{id:3,position:'sales'}]let list=arr.reduce((pre,cur)=>{ let target=pre.find(ee=>ee.id == cur.id) if(target){ Object.assign(target,cur) }else{ pre.push(cu
2022-01-06 10:30:35
3265
原创 dayjs的用法
安装npm install dayjs --save调用import dayjs from "dayjs"Vue.prototype.dayjs = dayjs;//可以全局使用dayjsAPI 当前时间 dayjs() 时间字符串 dayjs('2018-06-03') 时间戳 dayjs(1528361259484) Date 对象 dayjs(new Date(2018,8,18)) 复制 dayjs().c
2021-12-22 16:34:39
3035
原创 echarts引入地图
<template> <div ref="myChartChina" :style="{width: '100%', height: '500px',background:'pink'}"></div></template> <script>import * as echarts from "echarts";import '@/assets/js/china.js' // 引入中国地图数据export default {
2021-11-26 16:48:02
1701
原创 vue项目 使用three.js技术实现glb模型加载，点击变色，border高亮
html部分<template> <div class="earth-container"> <div id="container" class="container" ref="container" /> </div></template>js部分glb模型加载，点击变色，border高亮<script>import * as THREE from "three
2021-09-25 11:28:39
4754
6
原创 cesium 淹没分析
<!DOCTYPE html><html lang="en"> <head> <!-- Use correct character set. --> <meta charset="utf-8"> <!-- Tell IE to use the latest, best version. --> <meta http-equiv="X-UA-Compatible" content="IE=edg
2021-09-01 13:26:36
491
原创 cesium笔记
//相机高度小于10000 //console.log(that.viewer.camera.positionCartographic.height.toFixed(0),1234)
2021-08-19 10:44:11
316
原创 在Vue框架下使用Fullcalendar
1.安装依赖npm install --save @fullcalendar/vue @fullcalendar/daygrid2.页面引用<template> <div class="rili"> <FullCalendar ref="fullCalendar" style="height: 100%" :options="calendarOptions" ></FullCalendar>
2021-07-05 13:28:00
635
原创 cesium 动态水流效果
一.创建 PolylineTrailLinkMaterialProperty.jsimport * as Cesium from "cesium/Cesium";const PolylineTrailLinkMaterialProperty = (function() { function PolylineTrailLinkMaterialProperty(options) { options = Cesium.defaultValue(options, Cesium.defa
2021-07-02 10:53:53
3060
10
原创 cesium 相关知识点
1.相机高度获取方法function getHeight() { if (viewer) { var scene = viewer.scene; var ellipsoid = scene.globe.ellipsoid; var height = ellipsoid.cartesianToCartographic(viewer.camera.position).height; return height; }}console.log(getHeight());
2021-06-30 14:21:28
456
原创 echarts字体自适应的写法
//echarts字体自适应的写法//当前视口宽度let nowClientWidth = document.documentElement.clientWidth; //换算方法export function nowSize(val,initWidth=2520){ //return val * (nowClientWidth/initWidth); if(nowClientWidth<1920){ initWidth = 1920; retu
2021-06-23 09:34:11
342
原创 echarts折线图tooltip自定义多条折现写法
<template> <div class="ebox"> <img class="borimg" src="~@/assets/img1/public/border.png" alt /> <div class="outborder" :id= "id"></div> </div></template><script>import echarts from 'echarts';i
2021-05-18 09:34:46
1733
原创 img加载失败显示本地图片
<img v-if="item.jbxxSbtzJbxx.picture != null" class="listimg" &
2021-05-07 09:53:36
592
原创 git远程仓库地址改变后，重新上传代码步骤
git远程仓库地址改变后，重新上传代码步骤以下均以项目git_test为例：老地址：http://192.168.1.12:9797/john/git_test.git新地址：http://192.168.100.235:9797/john/git_test.git 远程仓库名称： origin方法： 通过命令先删除再添加远程仓库git remote 查看所有远程仓库git remote rm origin 删除老的远程仓库git remote add origin http://192
2021-03-09 13:32:09
4338
原创 图片自动播放
<template> <div class="conternt"> <div id="panorama"> <div class="typebtn"> <li @click="typeBtn(index,item)" v-for="(item, index) in typeArr" :class="index == red ? 'red' : '' "> {{item.name}}
2020-12-17 16:10:31
378
2
原创 vue element ui 上传组件的使用
第一步：html的写法特别说明：name一定要写，就是接口要传的参数<el-form-item label="图片:"> <el-upload class="upload-demo" :action="UploadUrl()" :on-change="handleChange" name="dropFile" list-type="picture" :file-list="fileList"> <el-button size=
2020-11-11 16:13:28
285
1
原创 后端返回数据流vue前端数据导出excel表格及的方法
注意两点1、responseType: ‘blob’，一定不能少，不然数据解析不出来，乱码2、res一定要根据流的位置进行更改export function exportMethod() { axios({ method:'get', url: url+'params', // responseType: 'blob'，一定不能少，不然数据解析不出来，乱码 responseType: 'blob' }).then((res
2020-10-20 10:22:57
643
原创 Vue 报错 Failed to resolve filter： toFixed
语法错误，解决办法：添加如下代码 filters:{ toFixed:function(val){ if(typeof val == 'number'){ return val.toFixed(2) } } },注意：位置不能错误，下面是自己项目位置截图
2020-10-13 16:25:51
872
原创 Avoided redundant navigation to current location: “/home”
在VUE中路由遇到Error: Avoided redundant navigation to current location:报错显示是路由重复首先打开我们的路由配置文件，router文件夹下的index.js。在index.js添加如下代码import Vue from 'vue';import VueRouter from 'vue-router';Vue.use(VueRouter);// 解决ElementUI导航栏中的vue-router在3.0版本以上重复点菜单报错问题
2020-10-12 17:01:16
4419
1
原创 VUE项目 openlayers测量面距功能的写法
VUE项目 openlayers测量面距功能的写法首先创建measure.js,位置根据自己的项目放置就行，代码如下import Draw from 'ol/interaction/Draw'import VectorSource from 'ol/source/Vector';import VectorLayer from 'ol/layer/Vector';import Point from "ol/geom/Point";import { unByKey} from 'ol/
2020-09-05 17:06:39
1502
6
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人