- 博客(33)
- 收藏
- 关注
RSS订阅原创 geoserver发布tif影像，关于黑边的问题
这是设置GeoTIFF的时候可以这样去设置，但是通过缩放的时候发现还是有黑边的出现（不知道啥情况）设置后图层，进行访问就发现没有黑边了。二、ImageMosaic。
2024-02-04 11:34:44
574
原创 vue中使用openstreetmap当div大小改变会出现空
项目中通过点击放大缩小界面从而去渲染openstreetmap地图的时候，会出现空白的的地图界面，如何缩放地图都不会填充
2023-02-18 10:17:16
351
原创 vue中使用leaflet渲染osm地图，使用leaflet-linear-measurement插件
leaflet-linear-measurement插件
2022-07-02 10:38:14
852
2
原创 vue中使用elementui的loading实现局部加载中
在做渲染表格或者其他请求后台数据时做加载中过渡直接上代码，在uitls文件下新建一个loading.js，代码如下，可以直接使用import Vue from "vue";import { Loading } from "element-ui";let loadOn;let loadingCount = 0;function startLoading(target) { const options = { lock: true, text: "Loading...",
2022-05-26 18:08:54
2500
3
原创 vue中使用webpack-bundle-analyzer分析打包大小
1，在vue-cli3中：首先先安装webpack-bundle-analyzer：npm install webpack-bundle-analyzer --save-dev在vue.config.js文件中chainWebpack: (config) => { if (process.env.use_analyzer) { config.plugin("webpack-bundle-analyzer").use(require("webpack-bundle
2022-04-27 10:49:23
4245
原创 vue优化，vue.config.js的配置
直接上代码：// const proxy = require("http-proxy-middleware");const CompressionPlugin = require("compression-webpack-plugin");const webpack = require("webpack");const cdn = { // 忽略打包的第三方库 externals: { vue: "Vue", vuex: "Vuex", "vue-router":
2022-02-12 10:14:12
626
原创 vue图片裁剪插件vue-cropper
vue-cropper插件的官网的地址：https://github.com/xyxiao001/vue-cropper在线的demo展示：http://github.xyxiao.cn/vue-cropper/example/安装npm install vue-cropper使用在需要的组件中直接引用，或者在main.js中import VueCropper from 'vue-cropper'Vue.use(VueCropper)组件内1.设置出一个点击展示裁
2022-01-28 15:37:00
6613
原创 pc端和移动端鼠标事件,实现与微信按住说话差不多的按键
1、移动端：事件类型：touchstart : 触摸开始（手指放在触摸屏上）touchmove : 拖动（手指在触摸屏上移动）touchend : 触摸结束（手指从触摸屏上移开）直接上栗子，做一个简单的按住说话，移开一定距离提示松开取消：put type="button" name="" id="messageBtn" value="按住 说话" />js：initEvent() { var btnElem = document.getElementBy
2021-12-29 11:01:10
802
原创 谷歌，高德，必应地图中英文显示
1. 谷歌英文显示https://maps.googleapis.com/maps/api/js?key=youkey&sensor=false&libraries=places&language=en-us设置language就行，其他国家语言设置参考：https://malagis.com/google-maps-js-map-display-language.html2. 高德英文显示（默认中文） //初始化地图 var map = new A
2021-07-28 10:35:15
4333
原创 谷歌地图地理编码两种方式请求返回地址
首先到谷歌账号中启用Geocoding API，该API是需要付费的，每个月超过一定的数量来计算。谷歌地图语言设置：https://malagis.com/google-maps-js-map-display-language.html1.官网中的方法：导入script：https://maps.googleapis.com/maps/api/js?key=youkey&sensor=false&libraries=places&language=en-us"...
2021-07-14 10:16:00
1054
原创 git上传出现密码配置错误（incorrect username or password）的解决办法
在公司上传项目时出现：解决方案：window7电脑的控制面板-->用户账户和家庭安全-->凭证管理器然后继续Git上传：把凭证中的用户名改成项目上传的设置的用户名，然后密码就是Git账号的登录密码，很多不知道这个密码，这里需要注意...
2021-07-05 16:34:56
1613
原创 vue中封装组件优化页面的数据的展示
开发项目时，有时候一页的数据过多，但是只想展示可视框列表时，滚动时再加载出来<template> <div> <div class="list" id="scroll-list" :style="{ height: contentHeight + 'px' }" ref="contentRef" @scroll="scrollList"> <div class="scroll-bar" ref="scrollBar">
2021-07-02 14:31:38
222
原创 vue中简单的中英文切换组件
<template> <div class="zq-drop-list" @mouseover="onDplOver($event)" @mouseout="onDplOut($event)"> <span><i class="iconfont icon-yuyanqiehuan"></i></span> <ul v-dpl ref="ul_cont"> <li v-for="(ite.
2021-07-02 14:15:19
479
原创 vue的table表格组件的封装
封装的vue表格组件，整理记录下1，分为两个组件去封装，一个是基本的表格的框架组件，一个是行内容组件基本的表格框架组件：增加了移动调整列大小功能<template> <div class="data-table"> <!-- 表格标题 --> <table> <thead> <tr ref="dataTableHead"> <th v-if="i
2021-05-07 10:02:03
3054
原创 使用jquery实现中英文切换
中英文切换有很多种方式，现在就基于jquery的一种方式，使用的是：jquery.i18n.js1，首先先引入jquery文件2，然后新建文件jquery.i18n.js(function ($) { $.fn.extend({ i18n: function (options) { var defaults = { lang: "", defaultLang: "", filePath: "./i18n/", ..
2021-05-06 17:10:19
2524
2
原创 vue中使用svg-icon遇到的坑
1.每次在项目中使用icon的图标时，总是觉得引入很长的路径很麻烦，最近发现一个插件挺好用的，svg-sprite-loadersvg-sprite-loader实际上是把所有的svg打包成一张雪碧图，再通过<use xlink:href="#xxx"/>来显示你所需的icon，但是在使用的过程总会出现问题；2.安装依赖：npm i svg-sprite-loader --save3.vue中vue.config.js中的配置： chainWebpack(conf.
2021-03-27 17:38:51
3805
3
原创 vue-cli项目中安装sass-loader遇到的坑
最近在项目中需要用到sass，安装sass-loader后发生错误：INFO Starting development server...ERROR Error: Rule can only have one resource source (provided resource and test + include + exclude) in { "exclude": [ null ], "use": [ { "loader": "D:\\zenos\\s...
2020-10-27 18:15:52
5571
7
原创 vue中使用iview中upload上传图片显示出来
代码是用pug模板写的Col(span='24') FormItem(label="Photos & Videos") Upload( multiple ype="drag" action="//jsonplaceholder.typicode.com/posts/" :before-upload='handlePhotoSuccess' ) div(style="padding: 20px 0".
2020-07-16 15:01:30
2607
原创 前端实现括号匹配，假如字符串有且仅有"[],{},(),''"几种，判断字符串是否符合规格
给定一个只包括'(',')','{','}',[','],''的字符串 判断字符串是否有效 有效字符串需满足： 左括号必须用相同类型的右括号闭合 左括号必须以正确的顺序闭合 注意空字符串可被认为是有效字符串 输入 "()" "()[]{}" "([)]" 输出 t...
2020-04-28 18:08:26
1008
原创 Vue实现简单的留言板
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="css/bootstrap.css" /> <style ty...
2020-03-12 22:04:19
1185
原创 gulp的安装使用过程
gulp的安装与配置执行1.首先新建一个项目目录；2.在项目目录下新建一个src的目录；3.新建一个gulpfile.js；配置gulp环境：1.首先确认电脑是否装有gulpgulp -v;2.安装cnpm install --global gulp-cli3.安装gulp作为开发时的依赖项npm install --save-dev gulp4.检查...
2020-03-09 22:52:14
394
原创 安装gulp-sass，node-sass
安装gulp-sass，node-sass（npm安装node-sass）1.使用淘宝镜像进行安装（命令窗口）npm config set sass_binary_site https://npm.taobao.org/mirrors/node-sass/2.安装node-sass和gulp-sassnpm install node-sass gulp-sass --sa...
2020-03-06 19:14:43
780
原创 jquery实现抽奖
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> #lottery { width: 570px; height: 510px; ma...
2020-02-25 22:04:14
677
原创 常见的正则表达式
正则表达式常见的有 \w \s \d \b. 匹配除了换行符以外的任意字符；\w 匹配字母或者数字或者下划线或者汉字 等价"[Aa-Zz0-9]"\s 匹配任意的空白符\d 匹配数字\b 匹配单词的开始或结束^ 匹配字符串的开始$ 匹配字符串的结束/-/g 匹配字符串中所有的"-"...
2020-01-20 10:21:03
165
原创 JavaScript基础概念
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>js基础概念</title> </head> <body> <script type="text/javascript"> //1.JS是什么 ...
2020-01-15 17:21:06
208
原创 css3帧动画的实现
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>序列帧动画</title> <style> .main{ height: 30...
2020-01-05 17:26:05
216
原创 手风琴案例
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>手风琴特效</title> <style> *{ margin: 0; padding: 0; } body{ background: #ccc; ...
2019-05-07 21:53:32
289
原创 两个立方体旋转
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>3D立方体</title> <style> .box1{ width: 200px; ...
2019-05-07 21:38:44
321
原创 简单八卦图的实现
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>八卦图</title> <style> .box{ height: 300px; width: 400px; background: rgba(51,10...
2019-05-07 21:32:24
455
原创 transform扑克牌旋转
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>扑克旋转</title> <style> *{ margin: 0; padding:...
2019-05-07 21:29:16
412
原创 用js简单实现图片轮播
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> *{ padding: 0; margin: 0; }...
2019-03-08 16:53:55
254
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人