- 博客(15)
- 收藏
- 关注
RSS订阅
原创 在vue中使用腾讯地图绘制围栏功能
首先，先看效果图里面包含了自定义多边形绘制围栏。圆形绘制以及矩形等方式，以及清除围栏经纬度的方法和获取围栏经纬度的方法。首先在项目的index.html中引入腾讯地图<script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=你的密钥&libraries=drawing"></script>在你的密钥这个位置。去腾讯地图申请，然后替换了就可以了。最后奉上具体代码：<temp
2020-08-13 17:24:14
5517
2
原创 vue中使用echarts自定义图例格式
在具体项目中，如果我们想实现以下效果，点击最下面小圆点，能够控制折线图折线的显示和隐藏，那么方便我们实现，我们可以手写最下面图例样式与格式。但是同时还需要控制折线图折线，我们只需这样做即可：```javascript // 切换图例的选中状态。 dispatchAction(name) { this.chart.dispatchAction({ type: 'legendToggleSelect', name: name // 图例名称
2020-08-05 11:39:32
1770
原创 echarts之河南省市地图（根据数据大小控制颜色显示变化）
直接上代码：var mapOption = { tooltip: { show: true //鼠标经过提示 }, visualMap: { show: false, min:10, max: 50, //控制根据返回值 控制数量 text: ['High', 'Low'], ...
2020-04-22 10:30:05
2938
8
原创 echarts环形图默认中间显示固定数据
在使用echarts 环形图时，有时候我们开发需要 环形图 中间默认显示我们需要的数据，我们可以这样改一下代码；改之前：修改之后：修改代码如下： normal: { show: true, position: 'center', formatter:function(...
2019-11-11 18:02:01
10743
2
原创 改变echarts柱状图 默认大小 位置调整问题
在使用echarts 柱状图时，默认图形是居中的，可能两边会有些空白，但有时候会影响页面整体美观效果，所以我们只需要加一段代码进行调整一下即可， grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true },加在这个位置之后...
2019-11-11 17:57:58
15294
1
原创 改变echarts环形图 图形大小 以及内外边距
在使用echarts图表工具时，有一些小细节往往不容易实现，例如，使用环形图时，图形是默认居中的 ，左侧就会冗余一大片空白，比如这样：这个时候,如果想要去掉这片空白，只需要添加一行代码即可：name:'访问来源', type:'pie', radius: ['50%', '65%'], // 设置成绝对的像素值 // center: [200, 300], // 设置成相对的百分比 cent...
2019-11-11 17:51:50
15602
2
原创 vue在IE浏览器报Error in nextTick: "InvalidCharacterError"解决方案
vue在IE浏览器报Error in nextTick: "InvalidCharacterError"解决方案关于解决vue开发在IE浏览器报Error in nextTick: "InvalidCharacterError"错误解决方案，哈哈，首先你要知道"InvalidCharacterError（无效字符错误）"这个很难读并且很难懂它的意思，知道了之后就在你自己vue项目中找到html...
2019-11-01 00:50:33
5291
原创 echarts实现dataZoom区域缩放
如果柱状图过多，想要实现随着鼠标滚轮区域缩放，那么只需要用dataZoom即可实现：dataZoom: [ { type: 'slider', start: 0, end: 100 }, { type: 'inside', start: 0, end: 100 }],
2020-09-02 14:55:30
1133
原创 xtem.js如何设置终端的配置
最近在一个项目中用到webssh，基于xtem.js实现的网页上SSH终端。其中需要修改终端的配置选项，便查了各种资料，最终得到解决。首先，我们要先了解xtem.jsxterm.js是什么?xterm是一个使用TypeScript编写的前端终端组件。终端的配置选项方法 setOption例如我们要修改光标样式就是setOption("cursorStyle","underline")...
2019-12-03 17:30:44
861
原创 package.json和package-lock.json的区别和作用
做项目时，我们去npm i 会把内容记录到package.json文件中，下载的包都会发生变化，为了系统的稳定性考虑，每次执行完npm install之后会对应生成package-lock文件，该文件记录了上一次安装的具体的版本号。根据官方文档，package-lock.json 是生成的系统当前安装的库的具体来源和版本号，锁定版本。当你执行npm install的时候， node会先从pa...
2019-11-27 11:16:28
277
原创 html页面中table超过高度出现滚动条
想要实现这样的功能需要在表格外面定义一个div,并且设置div高度，overflow:scroll;比如：<div style="height:290px;width:100%;display:block;overflow-y:auto;"> <table></table></div>...
2019-11-19 14:31:25
4739
原创 html页面中table超过页面宽度出现滚动条，单元格内容不换行实现效果
在页面上加上两行样式即可：<div style='overflow:auto'> <table style='white-space: nowrap'> </table></div>``父元素添加overflow:auto子元素添加white-space: nowrap快去试试吧！！！...
2019-11-19 11:47:27
2035
1
原创 解决使用tab选项卡切换时，swiper轮播图初始化失败
在最近一个项目中用到swiper轮播图，需要tab切换，但无论怎么点击，只有第一个tab里的swiper是正常的，其他无法完成初始化。这个时候我们只需要加入两行代码即可：解决办法：observer:true,//修改swiper自己或子元素时，自动初始化swiperobserveParents:true,//修改swiper的父元素时，自动初始化swiper这个时候就能解决多个tab切换...
2019-11-18 14:16:40
1200
原创 swipe轮播图centeredSlides 参数选项配置（true居中或者false居左）
最近做一个项目需要用到轮播图，但在使用过程中发现一些问题，在使用引入到页面时，会发现和我想要的效果有些不一样；比如：这种情况就是左右两侧都有空白，这个时候需要把两侧空白去掉，我们只需要改一下centeredSlides这个参数选项配置，设定为true时，active slide会居中，而不是默认状态下的居左。设定为tfalse时，active slide会居左显示。 var prepe...
2019-11-15 15:35:06
7514
原创 ECharts关于堆叠柱状图的使用
最近在做一个项目需要用到echarts，所以一边学习ECharts官网上的中文API（http://echarts.baidu.com/examples.html）,然后一些细节部分如果没有我就再搜各位前辈写的代码，总算将功能实现出来了，下面就是我的代码以及最终效果图。先看效果图：有时候我们需要用到堆叠柱状图的效果，所以看代码、如下：series: [ {...
2019-11-13 10:21:41
2071
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人