2021年8月13日
echarts 饼图环形图图例位置
摘要： option = { title: { text: '', textStyle: { color: '#17F0E3', }, }, tooltip: { trigger: 'item', formatter: function (params) { return `${params.name}${ 阅读全文
posted @ 2021-08-13 15:44 骄傲一点才可爱 阅读(1603) 评论(0) 推荐(0) 编辑
echarts 多层环形图配置
摘要： echarts 多层环形图配置 var BorderWidth = '6'; //反方向剩下部分的样式 var placeHolderStyle = { normal: { label: { show: false, position: "center" }, labelLine: { show: 阅读全文
posted @ 2021-08-13 15:39 骄傲一点才可爱 阅读(2372) 评论(0) 推荐(0) 编辑
2021年7月22日
css 旋转div
摘要： 项目中需要做一个如下图的右侧监控操作控制台，通过定位在这个图片上放置了八个span，并设置内容为透明色，加点击事件来完成 覆盖在操作台图上的位置如下图：（去掉背景色设置字体为透明色就可以完美隐藏） HTML代码如下 <div class="monitoring-center-right"> <img 阅读全文
posted @ 2021-07-22 11:55 骄傲一点才可爱 阅读(221) 评论(0) 推荐(0) 编辑
2021年7月20日
css3 背景渐变色
摘要： 从左往右渐变色背景设置：如下图 渐变一：从左边开始的线性渐变，起点红色，中间黄色，终点红色。 css代码: div{ height: 200px; background-color: red; /* 浏览器不支持时显示 */ background-image: linear-gradient(to 阅读全文
posted @ 2021-07-20 17:11 骄傲一点才可爱 阅读(695) 评论(0) 推荐(0) 编辑
2021年7月15日
elementUI el-table表格表头单元格内容居中
摘要： <el-table :header-cell-style="{textAlign: 'center'}" :cell-style="{ textAlign: 'center' }" :data="tableData" stripe style="width: 100%"> <el-table-col 阅读全文
posted @ 2021-07-15 16:50 骄傲一点才可爱 阅读(891) 评论(0) 推荐(0) 编辑
2021年6月22日
对象的常用操作
摘要： 1.对象追加属性 const object = {} object['name'] = '张三' object['age'] = 18 object['sex'] = '女' console.log(object) const item= { sex: '女', } item['name'] = ' 阅读全文
posted @ 2021-06-22 17:34 骄傲一点才可爱 阅读(89) 评论(0) 推荐(0) 编辑
通过for in获取对象属性名和属性值
摘要： 通过for in获取对象属性名和属性值 const object = { label: '张三', value: '111111', } for (const key in object) { if (Object.hasOwnProperty.call(object, key)) { const 阅读全文
posted @ 2021-06-22 17:10 骄傲一点才可爱 阅读(346) 评论(0) 推荐(0) 编辑
通过数组filter方法过滤数组中对象
摘要： 通过过滤器filter获取数组对象的属性名和属性值 const arr = [ { label: '张三', value: '111111', }, { label: '李四', value: '22222', }, ] //通过filter过滤获取到新数组 //第一种写法： // const ne 阅读全文
posted @ 2021-06-22 16:51 骄傲一点才可爱 阅读(3379) 评论(0) 推荐(1) 编辑
vue avue通过elementui 自定义导入按钮实现导入excel表格
摘要： 导入Excel功能实现步骤： 1.首先通过elementUI组件自定义导入按钮：如下图 代码如下：用的是elementUI的上传组件 实例1：列表（html部分）不需要下面的导入点击事件 <el-upload style="display:inline-block;" :show-file-list 阅读全文
posted @ 2021-06-22 15:33 骄傲一点才可爱 阅读(2293) 评论(0) 推荐(0) 编辑
2021年6月10日
avue-data数据大屏通用组件自定义折线图调用接口动态数据
摘要： avue-data数据大屏通用组件自定义折线图柱状图 我的例子是折线图带有放大缩小功能：如下图 1.选择通用组件，点击右侧配置列表的编辑按钮（echarts的所有样式都在这里可以配置）如下图 缩放折线图的配置列表代码如下： (data)=>{ console.log(data); return { 阅读全文
posted @ 2021-06-10 12:02 骄傲一点才可爱 阅读(4109) 评论(7) 推荐(0) 编辑