- 博客(14)
- 资源 (4)
- 收藏
- 关注
RSS订阅
原创 echarts自定义tooltip
echarts自定义tooltip显示使用echarts展示图形的时候，鼠标滑倒图像上，想展示除了系列名，数据名，数据值以外的数据，这时需要使用tooltip的fommater方式进行配置，另外对数据格式也有一定的要求。如下图志愿者活跃数，显示y轴百分比的同时也要显示对应的月份和活跃志愿者总数1、首先要知道y轴如何更改数据格式不会影响图表显示能想到的肯定时数组直接赋值，那么把data改为由value和data组成的json串，这样不会影响图形的展示：value的值默认渲染y轴
2020-09-22 11:00:56
6981
3
原创 Vue之ant design的table表格序号连续自增
结合分页实时监听当前页和pagesize值，从而实现a-table表格随数据连续自增，代码如下： <a-table :columns="columnShareDetail" :dataSource="cameraList" :pagination="paginationOpt" bordered ></a-table>
2020-05-09 16:09:05
8035
4
原创 Ant Design Vue 之分页 a-pagination使用
我们在使用分页使，直接用表格(<a-table>)的自定义:pagination属性最方便；如下图所示：基于VUE，我们必须在data中定义paginationOpt对象，代码片段如下：// 分页 paginationOpt: { defaultCurrent: 1, // 默认当前页数 defaultPageSize: 5, // 默认当前页显示数据的大小 total: 0, // 总数，必须先有 sh.
2020-05-09 13:36:37
21685
20
原创 word 转html回显至富文本编辑器中（渲染页面）——mammoth.js
场景：在开发中，前端将本地word导入富文本编辑器中，实现预览、再编辑等功能，我使用的是mammoth插件，并且是基与jquery环境下，后面会放一个demo注意需要将文件转换.docx文档，本地上传至富文本编辑器中，复杂样式会丢失，目前不花钱的没有找到更好了，如果你们有欢迎留言分享一下。...
2022-07-11 12:02:09
3381
原创 安卓手机实现无需下载即可预览pdf文件
1、从pdf.js官网中下载实例，里面可以把相关的文件放在oss或者web服务上，但是要修改demo中的html文件（Mac打不开该实例的html文件，打开是个空白，window可以，原因未知，不影响使用）2、修改的部分如下图所示getQueryVariable方法如下 function getQueryVariable(variable) { var query = window.location.search.substring(1); var vars =
2021-04-15 10:18:24
1837
原创 Vue实现循环滚动之vue-seamless-scroll的使用
Vue中我们拿到接口返回的数据之后，进行循环滚动操作，可以使用vue-seamless-scroll 实例文档，具体如下1、安装cnpm install vue-seamless-scroll --save2、引用import vueSeamlessScroll from "vue-seamless-scroll";Vue.use(vueSeamlessScroll);3、使用<!-- <template>中 --> <vue-seamless
2021-04-15 09:46:10
1697
原创 实现可拖拽移动的悬浮按钮（FBA按钮）
实现可拖拽移动的悬浮按钮不论在什么场景，最重要的是监听按钮的移动距离以vue为例，如下：<template> <div> <div v-show="isShow" class="back-btn" @click.stop="goback" ref="backDom"> </div> </div></template>在methods中定义如下方法，mounted中调用，
2020-09-25 17:01:12
513
原创 vue视频播放插件vue-video-player
vue视频播放插件-vue-video-player的使用1、安装npm install vue-video-player -S2、配置在项目的main.js中 写入以下代码：import VideoPlayer from 'vue-video-player'require('video.js/dist/video-js.css')require('vue-video-player/src/custom-theme.css')Vue.use(VideoPlayer)3、引
2020-09-22 14:13:51
1281
转载 Html5中video标签的属性和方法
video的属性和方法总结https://blog.csdn.net/qq_38163146/article/details/100588111
2020-09-22 14:00:25
408
原创 vue视频播放组件之vue-mini-player
1、vue-mini-player安装： npm install vue-mini-player -S2、封装视频播放组件 <template> <div class="qun-video"> <VueMiniPlayer :video="video" /> </div></template><script>export default { name: 'QunVideo',...
2020-07-28 16:09:43
2525
原创 echarts环形图分段留白
var placeHolderStyle = { normal: { label: { show: false }, labelLine: { show: false }, color: "rgba(0, 0, 0, 0)", borderColor: "rgba(0, 0, 0, 0)", bo...
2020-07-14 15:56:52
1242
原创 江苏省省市地图下钻
以下用到的json数据可在我的资源中下载：geojson地图数据江苏省省市地图下钻1、首先需要在china.json中找到省份代码再去找地区，拿到对应的json数据2、需要引用到echarts.min.js，利用echarts和我们的json数据渲染页面，进行区块事件的监听具体js代码如下：路径可以按自己的来var jiangsu = "../json/jiangsu.json";var yancheng = "../json/yancheng.json";var xuzhou
2020-07-14 15:47:31
1289
4
原创 Echarts 柱状图点击事件作用域问题
我们的柱状图分布不均匀，有些柱高可能会很小，如果通过myChart.on('click',function(){})来促发事件，可能在点击的时候不好操作，我们可以对在整个对serie的阴影部分绑定点击事件。如图所示：那么，能如何实现点击灰色区域触发绑定的事件呢本文总结了三种实现方法，介绍如下：一：利用echarts提供的新API convertFromPixel完美解决。（最好的办法）myChart.getZr().on("click", (params) => {const
2020-06-17 20:34:08
2418
翻译 vue+element_ui之表格组件封装
<template> <el-container class="page-table-ctn"> <el-table v-bind="$attrs" v-on="$listeners" :data="filterData" ref="pageTable" > <slot></slot> </el-table> <el-footer c.
2020-06-05 11:21:55
1375
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人