自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(28)
  • 资源 (5)
  • 收藏
  • 关注

原创 封装通用echarts(多次复用同一个图表)

【代码】封装通用echarts(多次复用同一个图表)

2024-04-09 18:37:07 147

原创 js如何通过数组中相同的元素12来将原始数组[‘12‘,‘13‘,‘12‘,‘14‘, ‘12‘,‘23‘,‘24‘]返回以相同元素12开头的3个新数组[‘12‘, ‘13‘], [‘12‘, ‘14

在reduce方法的回调函数中,我们检查当前元素是否以12开头,如果是,则将其添加到当前子数组中;如果不是,则将当前子数组添加到最终结果数组中,并创建一个新的子数组来存储下一个以12开头的元素。方法来实现这个功能。这个方法可以将数组中的元素逐个处理,并根据需要将它们放入一个新的数组中。,我们返回存储结果的数组,即包含以相同元素12开头的子数组的数组。方法遍历原始数组,将相同元素12开头的子数组放入新数组中。,我们将这些子数组放入一个新的数组中,以便返回结果。,我们需要创建一个空数组来存储最终的结果。

2024-03-01 14:49:29 420

原创 html + jquery地图点位点击变色

地图用图片展示,jquery实现相关的点击出现信息弹窗的操作

2024-03-01 14:42:59 819

原创 Vue Element表单中的label文字均匀占满显示

在Vue组件中,设置label-width属性为一个较大的值,以确保label的宽度足够容纳文字。这样,label文字将会均匀分布在整个label宽度内,实现文字占满显示的效果。在CSS样式中,使用text-align: justify来实现文字均匀分布。要让Vue Element表单中的label文字均匀占满显示。如果要全局应用这个样式,将上面的css代码复制到。

2023-11-22 17:00:24 335

原创 vue封装通用弹窗commonDialog

【代码】vue封装通用弹窗commonDialog。

2022-11-25 09:14:37 321 1

原创 vue中的echarts对象绑定click事件无法调用vue的实例对象

点击事件获取不到refName?方案一:function改为箭头函数方案二:var that = this;this代表的是当前对象,var that=this就是将当前的this对象复制一份到that变量中。当this对象改变的时候,that指向的还是当时的对象。echarts事件与行为...

2022-07-04 10:39:17 875

原创 vue Elementui Timeline 时间线(右)

<el-timeline :reverse="reverse"> <el-timeline-item v-for="(item, index) in warnList" :key="index"> <div class="photo"></div> <div class="timestamp"> <span class="message-label">时间:

2022-06-30 11:30:51 975

原创 timeline(左右结构)

<el-timeline> <el-timeline-item v-for="(item, i) in timeLineFilterData" :key="i" :timestamp="item.createdTime" placement="top"&gt

2022-06-30 11:28:29 1560

原创 vue Swiper(附例子)

安装依赖npm install swiper@6 --save-devnpm i [email protected] -Spackage.json查看确认main.js全局引入//swiperimport VueAwesomeSwiper from 'vue-awesome-swiper'import 'swiper/swiper-bundle.css'Vue.use(VueAwesomeSwiper)页面运用点击左右按钮切换<div class="ce

2022-03-04 11:22:38 331

原创 大屏左右下载入的动画

@keyframes leftAnimation { 0% { transform: translate(-100%, 0); opacity: 0; } 100% { transform: translate(0, 0); opacity: 1; }}@keyframes rightAnimation { 0% { transform: translate(100%, 0);

2022-02-28 15:12:28 76

原创 vue中使用lang = “scss“报错

①npm install [email protected] --save-dev②npm install node-sass --save安装node-sass报错安装不了,使用淘宝镜像安装cnpm install node-sass --save③npm install style-loader --save④在build/webpack.base.config.js中添加:{ test: /\.scss$/, loaders: ['style', 'css',

2021-12-15 10:28:13 914 1

原创 堆叠双柱状图

堆叠柱状图代码附图

2021-12-13 10:00:53 247

原创 隔行变色的echarts图

var xdata = ['2020-1-2', '2020-1-2', '2020-1-2', '2020-1-2', '2020-1-2', '2020-1-2', '2020-1-2'] var data = [70, 60, 80, 70, 60, 80, 50] option = { tooltip: { trigger: "axis", axisPointer: { // 坐标轴指示...

2021-12-13 09:55:24 716

原创 大屏右上角的年月日时分秒

methods:{currentTime() { setInterval(this.formatDate, 500) }, formatDate() { const date = new Date() const year = date.getFullYear() // 年 const month = date.getMonth() + 1 // 月 const day = date.getDate() // 日 c

2021-11-25 10:36:30 721

原创 按设计稿一比一开发且自适应屏幕

①安装less loadercnpm install less less-loader --save-dev在build目录下的webpack.base.conf.js 下配置loader{ test: /\.less$/, loader: "style-loader!css-loader!less-loader",}②安装lib-flexible插件cnpm i lib-flexible --savemain.js 里 引入 lib-flexible对flexibl

2021-11-12 14:43:32 299

原创 echarts图表动态显示数据

<script> var xData = (function () { var data = ['ZBFX', '治安重点', '人口重点', '刑释解教', '信访人员'] return data })() var ydata1 = [], ydata2 = [], ydata3 = [] var zdrykl = echarts.i

2021-10-27 09:57:02 625

原创 webstorm编辑less文件自动保存生成css文件

一://全局安装less npm install -g less二:点击“file(文件)”> “settings(设置)……” 弹出设置界面,在左侧导航找到“tool(工具)">“file Watchers” 点击“+”号按钮找到less文件选项点击添加。(点击确认后稍等一会儿,等他应用)三:最后随便编辑一个less文件,会自动生成以下...

2021-10-12 09:14:21 972

原创 仪表盘echarts图(附图与代码)

var datas = { value: 82, title: "任务完成占比", type: 1, radiusType: 1};let startAngle=180,endAngle=0;var fontColor = "#00f6f7";var seriesName = "";let noramlSize = 16;let state = "";let center = ["50%", "55%"];let wqradius = 0, nqra

2021-10-12 08:40:06 1336 1

原创 HTML滚动条样式修改

.newsPart::-webkit-scrollbar { /*滚动条整体样式*/ width : 6px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px;}.newsPart::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius : 10px; background-color: rgba(3 ,91 ,203 ,0.5); background-image: -web

2021-09-23 08:37:20 849

原创 elementui(el-date-picker)日期选择器的日历样式修改

/日历样式----------------------------------------------------------/.selfDate {background-color: #08294c !important;color: #61b7ff;border: 1px solid #85e9fc;.el-picker-panel__sidebar { background-color: #08294c !important; border: 1px solid #85e9fc;

2021-09-03 14:05:11 1356

原创 elementUI的form表单样式

/*form表单的样式*/ /deep/ .demo-form-inline { height: 30px; line-height: 30px; margin-left: 43px; //label样式 .el-form-item__label { color: #D0E9FF; font-size: 14px; line-height: 30px; } //输入框样式 .el-input__inne

2021-09-03 14:05:00 1661

原创 弹窗嵌套表格(表格可点击展开收起)

<template> <div> <el-dialog :visible.sync="dialogDetailInfo.show" width="48%" class="setDialog" :destroy-on-close="true" :modal-append-to-body="false" @close="closeDialog" > <div clas

2021-09-03 14:04:49 461

原创 vue实现展开收起

<template> <div class="select-box"> <div class="select-box-top"> <label>项目名称</label> <span v-if="isShowNameType" @click="handleIsShowNameType">展开</span> <span v-if="!isShowNameType" @clic

2021-09-03 14:04:26 180

原创 前端学习问题整理

1.vue插件eslint报错解决:找到build->webpack.base.config.js。注释或者去掉对eslint-loader的引用。2.实现禁止选中文字解决: div{ -moz-user-select:none; -webkit-user-select:none; user-select:none; } 3.Vue项目封装请求数据的接口总结一、配置url(能够放在一个js中)前端1.引入axios:import axios from “axi

2021-07-18 13:50:09 345

原创 前端学习笔记

uniapp横向滚动<template> <view class="content"> <scroll-view scroll-x="true" class="scroll"> <view class="box"> <image src="http://b-ssl.duitang.com/uploads/item/201703/01/20170301163305_...

2021-07-18 13:16:44 53

原创 win7电脑一开机就弹出“便筏已损坏”的解决办法

1.按照百度上的办法解决,先在磁盘右上角搜索InkObj.dll2.将InkObj.dll复制粘贴到C:\Windows\System32\文件夹下3.以管理员身份运行cmd,并执行命令regsvr32 C:\Windows\System32\inkobj.dll,回车Enter会弹出一个对话框到此问题应该就解决了。。。。but,如果你和我一样出现了问题或是你根本就搜不到inkobj.dll这个东西,你就可以看接下来我的解决办法我是在最后一步出现的问题,我..

2021-04-11 19:06:19 2499

原创 前端学习笔记

自学期间遇到的问题:1.在运行Vue项目时报错error 'scope' is defined but never used vue/no-unused-varsslot-scope="scope"改为slot-scope ="{}"2.搜索栏和表格绑定<el-tablestripestyle="width:100%":data="tableData.filter(data=>!search||data.bm.toLowerCase().inclu...

2021-04-11 12:44:17 181

原创 JavaScript学习笔记

JavaScript代码段的三种书写位置1.行内式(代码段在body内)<input style="button" value="点我" onclick="alert('hello js!')">2.内嵌(代码在head内)<script>alert("hello js!");</script>3.外部(代码在head内)首先新建一个以js为后缀的eg.js文件,并在其内部写下代码alert('hello js!')然后在HTML

2021-03-20 22:57:48 76 1

圆形旋转菜单menu.zip

代码实现圆形旋转菜单

2022-01-05

按钮的粒子效果jsParticle.zip

点击后的破碎效果

2022-01-05

卡片旋转木马效果.zip

前端HTML代码实现的卡片旋转木马效果

2022-01-05

大屏数字滚动出现的效果

大屏所需要的数字滚动出现的效果

2021-08-09

inkobj.dll.rar

inkobj.dll.rar

2021-04-11

空空如也

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

TA关注的人

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