2021年08月_疆~

11月 10月 09月 08月 07月 06月 05月 04月 03月 02月 01月

原创 Vue+Openlayer设置闪烁点LjOlWave-基于postrender机制

参考：https://xiehao.blog.csdn.net/article/details/119955823效果图：实现代码：<template> <div id="map" style="width: 100vw; height: 100vh" /></template><script>import "ol/ol.css";import TileLayer from "ol/layer/Tile";import Vect

2021-08-31 18:28:18 1336

原创 Vue+Openlayer实现实时定位

参考：https://blog.csdn.net/weixin_39340061/article/details/108196570效果图：实现代码： <template> <div id="map" style="width: 100vw; height: 100vh"></div></template> <script>import "ol/ol.css";import GeoJSON from "ol/for

2021-08-31 16:40:55 1055

原创 Openlayer中的Feature

引入：import { Feature } from "ol";import { Point, LineString, Polygon } from "ol/geom";创建点要素Point： let feature = new Feature({ geometry: new Point([104, 30]), });创建线要素LineString： let feature = new Feature({ geometry: new L

2021-08-31 15:58:03 9832

原创 Vue+Openlayer实现点击地图添加图标要素信息，编辑点位信息

效果图：实现代码：<template> <div> <div id="map" ref="map" style="width: 100vw; height: 100vh" /> <div id="overlay-box" /> </div></template><script>import "ol/ol.css";import TileLayer from "ol/layer/.

2021-08-31 15:28:38 2592

原创 GeoJson标准格式基本介绍

geojson格式：{ "type": "FeatureCollection", "features": [ { "type": "Feature", "geometry": { "type": "Point", "coordinates": [102.0, 0.5] }, "properties": {

2021-08-31 10:32:35 3851

原创 Openlayer中给feature设置不同的样式

方式一：geojson数据：geojsonData: { type: "FeatureCollection", features: [ { type: "Feature", properties: { name: "地块1", style: { fill: { ...

2021-08-31 10:20:56 5976

原创 JavaScript（JS）随记

判断是否为空：JavaScript随机获取数组Array中的值：let colors = ["orange","red","blue","yellow"];let color = colors[Math.floor(Math.random()*colors.length)];

2021-08-30 15:46:49 368

原创 Echarts折线图

效果图1：option:{ backgroundColor: "rgba(255,255,255,0)", tooltip: { trigger: "axis", axisPointer: { lineStyle: { color: { type: "linear", x: 0, .

2021-08-30 11:27:34 5357 2

原创 Vue+Openlayer实现轨迹路线

<template> <div> <div id="map" ref="map" style="width: 100vw; height: 100vh"></div> </div></template><script>import VectorLayer from "ol/layer/Vector";import VectorSource from "ol/source/Vector";im...

2021-08-27 16:24:45 12561 8

原创 Vue+Openlayer实现gif动态图

<template> <div class="LjOlGif">LjOlGif</div></template><script>import "ol/ol.css";import { Vector as VectorSource } from "ol/source";import { Vector as VectorLayer } from "ol/layer";import GeoJ.

2021-08-26 20:25:36 1086

原创 Vue+Openlayer中使用select选择要素

效果图：实现代码：<template> <div id="map" ref="map" style="width: 100vw; height: 100vh"></div></template><script>import "ol/ol.css";import { Map, View } from "ol";import { OSM, Vector as VectorSource } from "ol/source";..

2021-08-26 11:46:10 1887

原创 Vue+Openlayer加载动画

注意：实现动画时不能有scoped！！！！通过gif<template> <div class="test"> <div id="map" ref="map" style="width: 100vw; height: 100vh"></div> </div></template><script>import "ol/ol.css";import { Map, View, O...

2021-08-26 09:16:02 1076 1

原创 Vue+Openlayer中实现动画animate

参考：https://blog.csdn.net/qq_29722281/article/details/103834483效果1：<template> <div class="test"> <div class="css_animation" style="margin: 300px"></div> </div></template><style lang="scss">.t..

2021-08-24 18:14:18 746

原创 Vue中的$nextTick

this.$nextTick 将回调延迟到下次DOM更新循环之后执行。<template> <div ref="ref_test" @click="testClick()" style="cursor: pointer"> {{ content }} </div></template> <script>export default { data() { return { content: "旧.

2021-08-24 16:25:15 116

原创 Vue父子组件钩子函数调用顺序

参考：https://blog.csdn.net/csdn_yudong/article/details/113035397结果：通常我们在父组件中的mounted中执行initMap（）来初始化地图对象（其他钩子函数中执行initMap()将不会渲染出地图），而在上面的测试中我们可以看到子组件的mounted要比父组件的mounted先执行，导致子组件中获取的map为空对象。因此现在我们要考虑一种方式，可以先执行父组件的mounted，后执行子组件的mounted（只有这样子组件中才能..

2021-08-23 16:27:41 755

原创 Vue+Openlayer中测距测面和绘制点线面组件-LjMeasureDraw4326和LjMeasureDraw3857

效果图：首先下载turf.js:cnpm i -S @turf/turf全局引入turf.js//引入turf.jsimport * as turf from '@turf/turf'Vue.prototype.$turf = turf实现代码：<template> <div id="map" style="height: 100vh; width: 100vw"> <div style="position: fixed; ..

2021-08-23 11:57:18 1256

原创 JavaScript中实现数字保留2位小数

四舍五入：45.6784.toFixed(2) // 输出结果为 45.68不四舍五入Math.floor(45.6784 * 100) / 100 // 输出结果为 15.67

2021-08-20 18:37:38 649

原创 Vue中使用turf.js

在线版：直接在index.html中引入：<script src="https://unpkg.com/@turf/turf@6.3.0/turf.min.js"></script>然后就可以直接使用turf对象了离线版：下载：cnpm i -S @turf/turfmain.js中全局引入：//引入turf.jsimport * as turf from '@turf/turf'Vue.prototype.$turf = turf使用

2021-08-20 17:25:41 9003 1

原创 Vue+Openlayer使用draw实现绘制点线面功能

实现代码：<template> <div> <span size="mini" @click="drawFeature('Point')">画点</span> <span size="mini" @click="drawFeature('LineString')">画线</span> <span size="mini" @click="drawFeature('Polygon')">画..

2021-08-19 17:55:23 2942 1

原创 Openlayer投影

openlayer中默认投影为3857.引入：import { fromLonLat, transform } from "ol/proj";fromLonLat（）4326转为3857 view: new View({ projection: "EPSG:3857",//默认为 3857,可以不写 center: fromLonLat([104.29806, 30.5263]),// 数据格式4326转为3857

2021-08-19 11:42:39 334

原创 Openlayer随记

绑定事件鼠标点击事件：click鼠标划过矢量要素事件：pointermove （划过要素时，设置鼠标为手势：this.map.getTargetElement().style.cursor="pointer";）this.map.on("click", (e) => { console.log("e:", e); });获取屏幕坐标通过e.pixel获取屏幕坐标通过this.map.getEventPixel(e.original...

2021-08-19 10:46:13 2225 1

原创 Vue中封装Openlayer切换底图组件LjBaseLayerChange

效果图：使用：<template> <div id="map" style="width:100vw;height:100vh"> <div style=" position: fixed; top: 12vh; right: 30vw; z-index: 999; display: flex; gap: 5px

2021-08-18 15:26:40 338

原创 Vue中el-dialog修改样式

效果图：使用：<template> <div> <LjButton @click="dialogVisible = true">打开弹出框</LjButton> <div class="LjDialog"> <el-dialog title="" :visible.sync="dialogVisible" :modal-ap.

2021-08-13 10:37:03 9038 1

原创 div内文字的溢出部分用省略号...显示

单行 <div style=" width: 200px; overflow: hidden; border: 1px solid white; text-overflow: ellipsis; white-space: nowrap; " > 啦啦啦啦啦啦啦啦绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿绿

2021-08-12 11:11:21 6360

原创 Vue中v-for遍历数组和对象

遍历数组 <div v-for="(item, index) in [ { username: 'zhangsan', password: 123 }, { username: 'lijiang', password: '123123' }, ]" :key="index" > {{ index }} : {{ item }} </div&

2021-08-12 09:37:20 1543

原创 Vue 中使用vue-awesome-swiper

下载cnpm i -S vue-awesome-swiper@3vue-awesome-swiper@3它会自动安装好匹配版本的swiper，即4.5.1注意：下面截图中的swiper显示的是4.0.7,但其实真正安装好的是4.5.1vue-awesome-swiper根据不同的swiper版本也对应有不同的版本，主要有三个版本：Vue-Awesome-Swiper - v2.6.7 对应 Swiper3 Vue-Awesome-Swiper - v3.1.3 对应 Swi

2021-08-11 10:12:51 6787 1

原创 Vue封装滚动表格组件

目前只能滚动，点击item只有第一轮数据可以获取到，后面几轮点击获取不到数据首先安装：vue-seamless-scrollcnpm i -S vue-seamless-scrollmain.js中引入import VueSeamlessScroll from 'vue-seamless-scroll'Vue.use(VueSeamlessScroll)<template> <div class="LjTableScroll" :s...

2021-08-10 17:06:37 913

原创 Vue中使用vue-countTo组件

效果图：下载：cnpm i -S vue-count-to使用：<template> <div> <countTo ref="ref_countTo" :startVal="startVal" :endVal="endVal" :duration="3000" style="color: white; font-size: 30px; color: pi.

2021-08-10 09:44:28 1118

原创 Vue封装组件-表格展示数据-LjTable1

效果图：使用：<template> <div> <LjTable1 :tableData="tableData" labelColor="white" valueColor="#1DCBF3" borderColor="#1DCBF3" ></LjTable1> </div></template> .

2021-08-09 17:35:00 297

原创 Vue封装组件-面板3-LjPanel3

效果图：使用： <LjPanel3 width="300px" bgColor="rgba(2, 2, 2, 0.418)" :showBtnClose="true" @closeBtn="closeBtn" > 内容</LjPanel3 >LjPanel3<tem.

2021-08-09 16:23:53 244

原创 ElementUI修改el-tabs标签页组件样式

效果图： <el-tabs v-model="activeName" @tab-click="handleClick" :stretch="false" style="color: white; height: 300px; width: 100%" > <el-tab-pane label="用户管理" name="first">用户管理</el-tab-pane&

2021-08-09 15:24:41 17614 1

原创 vue无缝滚动组件-vue-seamless-scroll

下载cnpm i -S vue-seamless-scrollmain.js中引入：import VueSeamlessScroll from 'vue-seamless-scroll'Vue.use(VueSeamlessScroll)使用：<template> <div> <vue-seamless-scroll :data="listData" :class-option="seamlessS..

2021-08-09 11:20:46 690

原创 Vue封装组件-面板2-LjPanel2

效果图：使用：<LjPanel2 title="这是标题" width="300px"> 这是slot </LjPanel2>LjPanel2.vue:<template> <div class="LjPanel2" :style="{ width: width }"> <div class="LjPanel2_head"> <span>{{ .

2021-08-09 09:18:13 273

原创 css中box-shadow属性

外边框：box-shadow: 0 0 8px rgb(0, 204, 255); <div style=" width: 100px; height: 100px; box-shadow: 0 0 8px rgb(0, 204, 255); " ></div>内边框：只需在前面加个 inset即可box-shadow: inset 0 ..

2021-08-06 16:32:51 668

原创大屏中常见组件收集

效果图：直接用原生的select标签，最多就是改一下样式<template> <div class="menu5"> <select v-model="selectValue" class="theSelect"> <option value="">全部</option> <option value="baidu" label="百度">

2021-08-06 15:26:09 425

原创 Vue中封装组件-单选按钮组-LjRadioGroup

效果图：使用：<template> <div> <LjRadioGroup :showCancelBtn="true" currentItemName="a" :items="items" @handleClickItem="clickItem" @handleClickCancel="clickCancel" ></LjRadioGroup> </div

2021-08-06 11:17:10 832

原创 Vue封装组件-按钮-LjButton

使用：<template> <div class="menu5"> <div> <p> <LjButton>默认按钮</LjButton> <LjButton type="primary">主要按钮</LjButton> <LjButton type="success">成功按钮</LjButton> ..

2021-08-05 15:47:05 762 1

原创 Vue封装组件-通用面板-LjPanel

使用： <LjPanel title="标题" v-if="isDkInfoPanelVisible" :isShowTitle="false" :isShowBtnClose="true" @closePanel="closeDkInfoPanel" width="600px" > 内容 </LjPanel>Lj...

2021-08-04 18:02:32 674

原创 Vue封装组件-可折叠面板 LjCollapse

效果图：使用： <LjCollapse title="这是标题" headColor="orange" width="400px" bgColor="rgba(41, 41, 41, 0.589)" > 这是内容... </LjCollapse>LjCollapse.vue:<temp...

2021-08-04 16:05:05 1192 1

原创 Vue封装组件-显示值-LjShowValue

效果图：使用组件： <LjShowValue title="面积" :value="70.13" unit="亩" :isShowIcon="true" valueColor="#3fc8bd" valueSize="35px" height="50px" ></LjSh.

2021-08-04 11:18:25 189

java-jdk-8u152安装包java-jdk-8u152安装包java-jdk-8u152安装包

2024-07-29

nvm下载nvm下载nvm下载nvm下载nvm下载

2024-07-29

geoserver中发布geojson服务需要的包.zip

geoserver中发布geojson服务需要的包。里面有四个jar包，包括：gson-2.3.1.jar，gs-vectortiles-2.15.0.jar，java-vector-tile-1.3.4.jar，protobuf-java-3.6.1.jar

2020-10-03

ssm_spring_mvc.war

ssm_spring_mvc.war,实现了增删改查，数据回显，模糊查询

2019-06-15

ssm_spring_mvc_maven.war

ssm_spring_mvc_maven.war，页面用的bootstrap，实现了记录的增删改查，数据回显，模糊查询

2019-06-15

userlogindemo.zip

userlogindem zip

2019-05-27

数据结构与算法-C#版

这是C#版的数据结构与算法的代码实现，包括：顺序表，单链表，双链表；顺序栈，链栈；顺序队列，链队列；顺序串；用数组进行特殊矩阵的存储，稀疏矩阵的存储；顺序存储二叉树，链式存储二叉树，哈夫曼树；多重链表表示法存储树；用邻接矩阵解决图的编程问题，用邻接表解决图的编程问题，图的遍历（深度优先，广度优先），Dijkstra最短路径算法；冒泡排序，快速排序

2019-03-09

利用ASP.NET和百度地图API开发的校园地图

这是利用ASP.NET和百度地图API开发的校园地图，也是自己的webgis课程设计。实现的功能有：1.利用ASP.NET实现用户的登录与注册，并将用户的用户名及密码用Sqlserver数据库存储起来。2.此校园地图可以实现根据输入地图名查询地图，输入框输入关键字可以自动联想相关地址，鼠标滚轮或者右键地图视图实现地图的缩放，普通影像与卫星影像的互换，对工具条或比例尺的添加或删除，打开全景图等功能。

2019-01-01

ARCGIS二次开发课程设计

这是一个ARCGIS的二次开发项目，也是自己的期末课程设计。包含的功能有：对文件的打开，保存，另存为，地图的导出，鹰眼实现，交互式画点线面，简单着色，分级着色，唯一值着色，颜色浏览器，颜色选择器，颜色版，在地图视图下右键弹出“全图显示”等内容列表等基础功能，另外还实现了一些空间分析功能，如“缓冲区分析”，“叠置分析”。该安装包中还包含电子文档，视频。如果还有什么疑问，欢迎留言

2018-12-21