- 博客(187)
- 资源 (14)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 高德地图基于Three开发三维流动管线。
废话少说直接上干货，整体思路通过高德地图的GLCustomLayer图层加载Three三维管线。initThree 初始化三维场景 设置镜头 灯光 场景等。TubePath 为第三方工具 引用方法如下。buildWater 根据三维坐标加载管道水流。buildPipe 根据三维坐标加载管道璧。第一步将管线经纬度转成三维空间经纬度。
2024-06-28 15:18:14
897
原创 Mac系统快速切换和管理node版本
有一个模块n，是专门用来管理node.js的版本的。npm是用来安装n的包管理工具，前端很多工具都可以通过npm来发布，而n是专门用来对node进行版本管理的。，下载完一键式安装即可，安装完成后，命令行查看是否成功。不要下载最新版，推荐先下载稳定版的。
2023-10-18 11:38:08
1519
原创 TS中接口扩展和继承
//接口扩展：接口可以继承接口interface Person{ eat():void;}interface Child extends Person{ work():void;}class Sth implements Child { public name:string; constructor(name:string){ this.name=name; } eat(){ console.log(this.
2022-03-25 14:17:41
9442
原创 TS中接口的定义
接口的作用：在面向对象的编程中，接口是一种规范的定义，它定义了行为和动作的规范，在程序设计里面，接口起到一种限制和规范的作用。接口定义了某一批类所需要遵守的规范，接口不关心这些类的内部状态数据，也不关心这些类里方法的实现细节，它只规定这批类里必须提供某些方法，提供这些方法的类就可以满足实际需要。 typescrip中的接口类似于java，同时还增加了更灵活的接口类型，包括属性、函数、可索引和类等。1、属性接口 对json的约束function printLabel():void { con
2022-03-25 14:02:21
2086
1
原创 代替if的6种方法
1. 三元运算符。事例1带有IF的代码：function test(state) { if (state) { database.save(state) } else { alert('state is invalid') }}重构后代码：function saveCustomer(state) { return state ? database.save(state) : alert('stateis invalid')} .
2022-02-18 08:36:04
6990
转载 冷门又好用的 CSS 特性
1. 多列布局（Multi-column Layout）MDN - CSS Multi-column LayoutCan I Use - CSS3 Multi-column LayoutCSS 提供了对多列布局的支持。支持设置布局中的列数 (column-count)、内容应如何列之间的流动规则、列之间的间距 (column-gap) 以及列分割线（column-rule）的样式。比如可以实现下面的瀑布流效果：Codepen demo点击预览主要样式：.mas.
2022-01-05 17:14:44
1186
原创 mapbox+vue+ts实时路线轨迹
先上效果图首先做好准备工作需要一个轨迹移动的图标点位。 需要一个轨道线路图层。 需要起点和重点图标点位。 需要实时轨迹线路图层。 需要轨迹线路箭头图标 引入turf工具包。整体思路是通过turf.lineDistance()方法对路线进行分割（为了整体动画更佳流畅）。//点位分割代码let lineDistance: any = turf.lineDistance(route);for (let i = 0; i < lineDistance; i +=..
2021-12-10 14:17:37
1933
1
原创 TS 函数的定义
函数的定义 //函数声明法function run(){ return 'run';}//匿名函数var run2=function(){ return 'run2';}ts中定义函数的方法//函数声明法function run():string{ return 'run';}//错误写法function run():string{ return 123;}匿名函数var fun2=function():number{ ..
2021-12-06 13:18:33
3451
原创 TS中的数据类型 (下)
七.任意类型 // var num:any=123; // num='str'; // num=true; // console.log(num) //任意类型的用处 var oBox:any=document.getElementById('box'); oBox.style.color='red';八. null和undefined// var num:number;// console.log(num).
2021-11-25 10:40:41
1261
原创 mapbox根据距离范围扩大图层
var buffered = turf.buffer(turf.polygon(多边形经纬度), base, { units: 'meters' });
2021-10-29 16:46:29
973
原创 minemap图层自动适应边框，视角居中
tslint报错comment must start with a space 注释后必须跟一个空格字符例如// @ts-ignore
2021-10-29 08:58:55
1142
原创 微信下程序解决上传图片旋转问题
总体思路调取getImageInfo获取图片orientation参数，通过orientation返回值调用canvas重新生成图片。getImgInfo(e,src){ const that = this; wx.getImageInfo({ src: src,//图片的路径，支持网络路径、本地路径、代码包路径 success:(res)=>{ let canvasContext = wx.createCanvasContext('ca.
2021-08-30 14:38:18
1233
原创 Antd InputNnmber小数点保留两位
const limitDecimals = (value) => { const reg = /^(\-)*(\d+)\.(\d\d).*$/; if(typeof value === 'string') { return !isNaN(Number(value)) ? value.replace(reg, '$1$2.$3') : '' } else if (typeof value === 'number') { return !isNaN(valu.
2021-05-27 16:03:35
2458
原创 react 下载文件
/** * @desc 下载文件 * */ exportFile = url => { const linkElement = document.createElement('a'); linkElement .style.display = 'none'; linkElement .href = url; document.body.appendChild(linkElement ); li.
2021-04-06 19:47:22
620
原创 解决移动端removeEventListener无效问题
preventDefault = (e)=>{ e.preventDefault();}//添加监听事件document.addEventListener("touchmove", this.preventDefault , { passive: false });//移除监听事件document.removeEventListener("touchmove", this.preventDefault ,{ passive: false });document.addEve.
2021-02-09 11:07:52
1342
原创 antd-mobile+rc-form处理移动端表单验证
import React, {Component} from 'react'import { createForm, formShape } from 'rc-form';import { InputItem } from 'antd-mobile';class Form extends Component { static propTypes = { form: formShape, }; state = { nameErr: true }; submit =.
2021-01-02 11:32:25
3098
原创 react+nginx开启代码压缩gzip
首先项目安装compression-webpack-plugin模块cnpm install compression-webpack-plugin --save-dev在webpack.config.js 中 找到plugins对象添加一下模块new CompressionPlugin({ filename: '[path].gz[query]', // 目标资源名称。[file] 会被替换成原资源。[path] 会被替换成原资源路径，[query] 替换成原查询字符串.
2020-11-09 16:24:06
928
原创 记录一个React路由嵌套问题---引以为戒
1.React嵌套路由的父级不能添加exact属性，否则二级路由不显示。2.第一条带来的后遗症，如果不添加exact就会出现一级路由同时显示的问题，所以一级路由要用Switch包裹。一级路由<Router basename={'/basic'}> <Suspense fallback={<div/>}> <Switch> <Route path={'/login'} component={lazy(() =>
2020-11-06 10:37:02
733
原创 记录一次React安装less的血泪---引以为戒
npm安装lessnpm install less@5.0.0 less-loader --save //less必须是@5版本首先声明两个变量const lessRegex = /\.less$/;const lessModuleRegex = /\.module\.less$/;贴出webpack.comfig.js 中getStyleLoaders函数代码const getStyleLoaders = (cssOptions,lessOptions, preProc.
2020-11-05 16:08:41
510
转载 Antd 4 获取Form字段值
类组件获取表单字段值由于Antd 4中去除了Form.create方法创建Form实例得到getFieldDecorator、validateFields等方法，我们使用类组件想要Form上的方法就需要用到Ref来获得实例。import React, { Component } from 'react'import { Form, Input, Button } from 'antd'class Example extends Component { // 通过...
2020-10-20 11:55:37
6664
原创 Vue源码分析——第三章
Vue源码分析——第一章Vue源码分析——第二章 // only used in dev mode //检测 val必需是数字 function checkDuration(val, name, vnode) { if (typeof val !== 'number') { warn( "<transition> explicit " + name + " duration is not a valid number - " + "got " + ...
2020-09-10 16:28:10
706
原创 Vue源码分析——第二章
/* * Object.defineProperty(person,'name',{ configurable:false,//能否使用delete、能否需改属性特性、或能否修改访问器属性、，false为不可重新定义，默认值为true 是否可以编辑 enumerable:false,//对象属性是否可通过for-in循环，flase为不可循环，默认值为true 是否可以枚举遍历 writable:false,//对象属性是否可修改,flase为不可修改，默认值为true value.
2020-09-10 15:05:35
591
原创 Vue源码分析——第一章
Vue最新版本源码分析，每个函数功能注释的很清楚，重点模块逐行注释！/*! * Vue.js v2.6.9 * (c) 2014-2019 Evan You * Released under the MIT License. */(function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : .
2020-09-09 14:26:07
2089
原创 记录我开发的第三个小程序的心路历程
本帖记录小程序从思路到开发结束的全过程。一个微信小程序的的诞生 记得七月底回家时候，我老姐说：“哎呀现在这个记忆力越来越差了，连你的生日都记不住了”，咱也不知道是真的记忆力退化还是选择性的记忆退化，咱也不敢问啊，所以就有了一个微信小程序的诞生。反正我不管你是不是真记不住（哼 我估计就是没准备礼物给自己找台阶下呢）以后每年到日子它就帮我提醒你。想想就觉得好贴心（可能我姐并不这么想），那就话不多说撸起袖子就是干。开始总是简单的 已经有了终极目标，那就细化一下具体功能。初步的设想就...
2020-08-22 16:32:07
10964
1
转载 CSS常用特效
本文是笔者写CSS时常用的套路。不论效果再怎么华丽，万变不离其宗。1、交错动画有时候，我们需要给多个元素添加同一个动画，播放后，不难发现它们会一起运动，一起结束，这样就会显得很平淡无奇。那么如何将动画变得稍微有趣一点呢？很简单，既然它们都是同一时刻开始运动的，那么让它们不在同一时刻运动不就可以了吗。如何让它们不在同一时刻运动呢？注意到CSS动画有延迟（delay）这一属性。举个栗子，比如有十个元素播放十个动画，将第二个元素的动画播放时间设定为比第一个元素晚0.5秒（也就是将延迟设为0.5秒），其
2020-07-17 16:37:54
12565
2
原创 uni-app 获取地址位置
uni.getLocation(OBJECT)获取当前的地理位置、速度。 在微信小程序中，当用户离开应用后，此接口无法调用；当用户点击“显示在聊天顶部”时，此接口可继续调用。OBJECT 参数说明参数名 类型 必填 说明 type String 否 默认为 wgs84 返回 gps 坐标，gcj02 返回国测局坐标，可用于uni.openLoc...
2020-06-30 11:34:17
62961
5
原创 uni-app 提示框
uni.showToast(OBJECT)显示消息提示框。OBJECT参数说明参数 类型 必填 说明 title String 是 提示的内容，长度与 icon 取值有关。 icon String 否 图标，有效值 "success", "loading", "none" image String 否 ...
2020-06-16 09:55:37
93678
7
Dynamic-effect-of-canvas-ring-master.zip
2019-08-03
iOS 提交审核文档
2018-03-31
input输入粒子动画
2018-03-31
javascript百度地图多个多边形点击事件，个别的无法响应
2018-06-09
TA创建的收藏夹 TA关注的收藏夹
TA关注的人