自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(131)
  • 资源 (1)
  • 收藏
  • 关注

原创 cesium 展示glb数据

这个数据会转成xyz ,所以可以将position换成。0:x, 1:y, 2:z 3:半径。这个shpere 中一共有4各参数。可以直接使用他的xyz 不需要转。xyz 转换成经纬度和高度。

2022-11-08 16:37:40 55

原创 前端常见问题(vue-题库一)

最近关注了一下前端面试题可以和大家 分享一下,有些解释的不全面或者不对的地方可以指正交流一下问题1:v-model 双向绑定的原理是什么答:问题2:v-for 为什么要加key答:

2022-08-23 17:36:20 179

原创 vue3 + view-ui-plus + js 项目 升级

vue3 + view-ui-plus + js 项目 升级

2022-07-27 15:15:14 1109

原创 vue3和vue2的区别并且如何升级 (对于vue2有基础的)

vue3 学习

2022-07-22 15:22:06 389

原创 mapbox-gl-draw 绘制态势标绘-进攻方向(尾巴)

代码】mapbox-gl-draw绘制态势标绘-进攻方向(尾巴)

2022-07-15 17:07:36 488

原创 vue 填写选择的日期

vue 填写带旬的日期

2022-07-08 16:38:32 194

原创 mapbox-gl-draw 绘制态势标绘-进攻方向

mapbox-gl-draw 绘制态势标绘-进攻方向

2022-06-29 09:56:51 377 2

原创 vue+css实现颜色渐变

<template> <div class="ColorGradient"> <div :style="legendDivStyle"> <div class="ui-legend-cell-div"> <template v-for="item in colorItems"> <div :key="item.id" :style="item.style"></d...

2022-06-24 09:52:44 383

原创 mapbox-gl-draw 绘制态势标绘-双箭头

mapbox-gl-draw 绘制态势标绘-双箭头

2022-06-23 10:32:15 457

原创 vue 使用mapboxgl 添加本地sprite雪碧图并且展示

文件放到public下面,运行后前面端口加上public下的位置在初始化的地方获取sprite.json文件 let request = new XMLHttpRequest(); request.open("get", window.location.origin + "/icons/sprite.json", true); request.onload = (oEvent) => { this.spriteJson = JSON.parse(re...

2022-04-18 13:34:27 1306

原创 js日历(包含农历节假日)

原始地址vue封装了个日历组件(包含农历,节日)_m0_49159526的博客-CSDN博客_vue日历插件显示节日的实现样式层级index.vue<!-- * @Description: * @Author: lzp * @Date: 2021-06-23 16:55:55 * @LastEditTime: 2021-07-02 12:25:17 * @LastEditors: xxx--><template> <div c..

2022-01-27 14:42:03 1979

原创 vue + gifshot 实现GIF动图

gitshot地址index.html 文件中引入<script src="https://cdn.bootcdn.net/ajax/libs/gifshot/0.3.2/gifshot.js"></script><template> <div class="makeGif"> <div id="gif"></div> </div></template><scr...

2022-01-06 13:47:11 1703

原创 雪碧图的展示和选择

<template> <div class="icon-svg"> <div class="icon-div" :style="{ width: positions.width + 'px', height: positions.height + 'px', 'background-position': '-' + positions.x + 'px -' + positions....

2022-01-06 13:39:29 352

原创 mapboxgl-minimap

var map = new mapboxgl.Map({ container: "map", style: "mapbox://styles/mapbox/streets-v8", center: [-73.94656812952897, 40.72912351406106], zoom: 7});map.on("style.load", function () { // Possible position values are 'bottom-left', 'bott...

2022-01-06 13:35:29 535

原创 iframe 子父传值,不跨域方法

发送方 window.parent.postMessage( { data: { code: "success", iframeHeight: height, }, }, .

2021-12-13 11:02:23 628

原创 window10 部署nginx 前端使用vue配置

下载地址nginx 官网安装首先现在下来后是压缩包1、先解压2.解压后在这个目录下打开cmd安装教程:https://www.cnblogs.com/taiyonghai/p/9402734.html配置前端配置vue 在vue.config文件下有个publicPath 对应的是nginx目录下的名称打包默认是 npm run build如果配置了package.json 文件 打包变成 npm run 配置的名称配置ngin...

2021-12-09 16:01:20 2539

原创 css 实现太极图

<template> <div class="box"> <div class="circle"></div> </div></template><script>export default { props: [], data() { return {}; }, watch: {}, methods: { init() {}, }, mounted...

2021-11-05 14:35:49 75

原创 mapbox 分屏对比2

这个是纯手写https://blog.csdn.net/xm_w_xm/article/details/103843217mapboxglhttps://github.com/mapbox/mapbox-gl-sync-move<template> <div class="hello" style="height: 100%; width: 100%; position: relative"> <div class="map1" ..

2021-09-08 17:51:32 216 1

原创 CSS transform 属性 实现矩形旋转

定义和用法transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。为了更好地理解 transform 属性,请查看这个演示。默认值: none 继承性: no 版本: CSS3 JavaScript 语法: object.style.transform="rotate(7deg)" 语法transform: none|transform-functions;值 描述 n...

2021-08-18 16:16:42 406 1

原创 canvas 基础学习笔记

颜色、样式和阴影属性 描述 fillStyle 设置或返回用于填充绘画的颜色、渐变或模式 strokeStyle 设置或返回用于笔触的颜色、渐变或模式 shadowColor 设置或返回用于阴影的颜色 shadowBlur 设置或返回用于阴影的模糊级别 shadowOffsetX 设置或返回阴影距形状的水平距离 shadowOffsetY 设置或返回阴影距形状的垂直距离 方法 描述 createLinearGradient(

2021-07-16 17:50:52 64 1

原创 mabox-gl 展示制定区域的影像,其他则有模态框

原理一、利用turf.mask将你想要的展示的geojson截取出来,这样就变成了一个中间镂空的geojsonturf.mask( ‘高亮数据’, ‘全球数据(这里用的正负180 和正负90)’);二、用中间镂空的geojson,颜色设置成你想要的模态框的颜色三、绘制一个高亮的位置,颜色设置成你想要的颜色就可以了zhegai() { if (map.getLayer("blueMask-line")) { map.removeLayer("blue...

2021-07-05 10:40:36 175

原创 Vue + 原生CSS3 实现像视频时间点在时间轴上效果并且可移动

<template> <div class="timeSwiper"> <div class="time-box"> <div class="time-title">时间</div> <div class="tool-left" @click="reduceYear(nowYear)"> <span class="icon iconfont">&#xe654;...

2021-06-29 15:40:41 676 1

原创 js动态添加table 添加行列,删除行列

<template> <div class="table-box"> <div class="code"> <textarea id="textarea" v-model="tablecode"></textarea> </div> <div class="tablebox"> <div class="operation"> <But...

2021-05-08 10:14:32 432

原创 Css 选择器

选择器 解释 div p div子元素下所有p元素 div>p div子元素选择器下所有p元素,不包括孙级及以下元素。 div,p 选择所有div元素和所有p元素 div+p 用于div选择紧挨着的同级兄弟p元素。 div~p 用于div选择后面的所有兄弟p元素。 ...

2021-04-07 16:51:16 35

原创 flex布局 - 零基础保姆级

一、实现效果二、代码<template> <div class="flex"> <div class="flex-box"> <div v-for="item in dataList" :key="item.id" class="flex-box-item"> <div class="flex-box-img" @click="jumpApp()"> <img :src

2021-04-01 16:37:51 143 1

原创 MultiPolygon MultiLineString MultiPoint geometry数据格式

目录一、MutiPolygon1.1、MutiPolygon-相交2.2、MutiPolygon-不相交2.3 MutiPolygon-中间镂空2.4 MutiPolygon-中间镂空在嵌套二、MultiLineString三、MultiPoint一、MutiPolygon1.1、MutiPolygon-相交{ "type": "FeatureCollection", "features": [{ "type": "Feat.

2021-04-01 11:27:43 1615

原创 vue+mapbox-gl-draw 绘制矩形并添加第一个点

添加draw组件 let modes = MapboxDraw.modes; modes.draw_rectangle = DrawRectangle; //添加工具 this.draw = new MapboxDraw({ modes: modes, displayControlsDefault: false, }); map.addControl(this.draw, "top-right")..

2021-03-25 17:52:13 2284 3

原创 js 中文排序

letarray=["武汉","北京","上海","天津"];array.sort(functioncompareFunction(param1,param2){//console.log("param1",param2)returnparam1.localeCompare(param2,"zh-Hans-CN",{sensitivity:"accent",});});consol...

2021-03-25 10:36:58 139

原创 vue+mysql+egg.js 搭建后台服务(零基础 增删改查)

egg.js 中文官网我之前分享的搭建cli3过程

2021-02-03 10:11:18 738 1

原创 微信小程序动态样式

<view class="{{theindex==index?'left-item-active':'left-item'}}" bindtap="changeIndex" data-item="{{item}}" data-index="{{index}}"> {{item.name}} </view>changeIndex(e) { // console.log(e.currentTarget.data...

2021-01-14 16:18:44 377

原创 vue+mapboxgl 运行轨迹循环

最终的样子+mapboxgl 官网的例子 :https://docs.mapbox.com/mapbox-gl-js/example/animate-a-line/turf.js 官网:http://turfjs.org/requestAnimationFrame 详解 我觉得写的很好:https://www.jianshu.com/p/fa5512dfb4f5一、实现思路1、绘制线2、绘制一个点,将线的第一个点赋值给点3、将geometry中线的每个节点值 ...

2020-12-11 18:00:36 841

原创 vue 微信登录(前后台详细教程)

一、pc端(网页端实现的是 扫码登录)微信网页应用登录开发指南第一步:点击微信登录的按钮的时候-调取微信登录的服务 请求code (前端)let APPID = "这个是申请的APPID";let REDIRECT_URI = encodeURIComponent("这个是在微信开发工具网页端的地方填写的地址 - 授权回调域 中 后面可添加"); this.urltest = `https://open.weixin.qq.com/connect/qrconnect?app.

2020-11-10 13:28:46 8013 3

原创 js 校验是手机端还是pc端

let that = this; if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) { that.ispc = false; } else { that.ispc = true; } window.addEventListener("resize", function () { if (/Android|webOS|iPhone|iPod|Bla..

2020-11-02 17:59:38 93

原创 vue-cli3搭建(新手小白)

一、介绍Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统。有三个组件:CLI:@vue/cli全局安装的 npm 包,提供了终端里的vue命令(如:vue create 、vue serve 、vue ui 等命令)CLI 服务:@vue/cli-service是一个开发环境依赖。构建于webpack和webpack-dev-server之上(提供 如:serve、build和inspect命令)CLI 插件:给Vue 项目提供可选功能的 npm 包 (如: ...

2020-10-27 15:04:42 94

原创 Vue Monaco Editor 编辑器的添加

monaco-editor 这个是可以查看的网站为什么每次编辑都会报错,我用的是cli3 看看哪位大神知道怎么解决啊 不知道为什么每次编辑的时候都会报这个问题需要配置哪里么?npm install monaco-editor --save话不多说先上图吧<template> <div class="myEditor"> <!-- <Button @click="RunResult">查看结果</Button&g...

2020-09-30 17:57:20 738

原创 js复制一个字符串到系统粘贴板

copyUrl() { var Url2 = document.getElementById("mainhtml").innerText; console.log(Url2, "url"); var oInput = document.createElement("input"); oInput.value = Url2; document.body.appendChild(oInput); oInput.select(); // 选.

2020-09-28 17:20:52 529

原创 cnpm i 无法下载依赖

输入这个set-ExecutionPolicy RemoteSigned然后再cnpm i 就可以了

2020-09-18 12:20:37 840

原创 vue +cesium 加载天地图

npm install cesium --savewebpack.base.conf.js文件const cesiumSource = '../node_modules/cesium/Source'output: { path: config.build.assetsRoot, filename: '[name].js', publicPath: process.env.NODE_ENV === 'production' ? config.build...

2020-09-10 14:38:54 2042 2

原创 js 数组去重

一、set方法去重var arr = [0,5,0,2,3,6,0,2,5,0,1,8,5,0]console.log([...new Set(arr),'==='])console.log(Array.from(new Set(arr)),'===')输出二、for循环去重var arr = [{id:0},{id:5},{id:0},{id:2},{id:3},{id:6},{id:0}]for(var i=0; i<arr.length; i++){

2020-09-01 12:18:07 58

原创 mapboxg 散点图

// 散点图 addScatterPlot() { console.log("加载散点图"); let source = { type: "vector", tiles: [ "后台服务/queryListCommonMvt/{z}/{x}/{y}.mvt?code=0" ] }; let inFoLayerscatterplot = { id: "scatt...

2020-08-20 09:31:35 436

vue+mapboxgl 鹰眼展示

运用vue加mapboxgl,编写的鹰眼图,全局视图,通过小图查看大图的展示功能 1、首先要有两个地图 大图,小图,鹰眼范围图(简称鹰眼) 2、大图移动,放大缩小的时候要相应的放大和缩小 3、小图不动,鹰眼图放大和缩小时,大图展示相应的位置

2020-05-25

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除