3.1.1 • Published 4 months ago
base-echarts v3.1.1
base-echarts
基于 echarts+vue3+vite
功能
- 自适应浏览器窗口
- 自适应盒子宽高
- tooltip 支持轮播、鼠标悬停
- 支持Echarts原生事件
基本配置
<BaseEcharts
:options="options"
:width="width"
:height="height"
:istool="true"
:interval="2000"
:loopSeries="true"
:seriesIndex="0">
</BaseEcharts>
options 图表基本配置
width 宽度 默认 100% 宽高默认100%,如果外层div不设宽度和高度,需要绑定宽高
height 高度 默认 100%
istool 是否允许tooltip自动轮播 默认关闭 false
interval tooltip 轮播时间间隔 默认 2000
loopSeries true表示循环所有series的tooltip, false则显示指定 seriesIndex 的 tooltip
seriesIndex 默认为0,指定某个系列(option中的series索引)循环显示tooltip,当loopSeries为true时,
从seriesIndex系列开始执行
isCache 默认为false, 是否关闭echarts缓存
使用方式
安装: npm install base-echarts
引用:
组件内引用:
import { BaseEcharts } from 'base-echarts'
全局挂载使用:
// main.js import { install } from 'base-echarts' app.use(install)
基本配置:
<BaseEcharts
:options="options"
:width="width"
:height="height"
:istool="true"
:interval="2000"
:loopSeries="true"
:seriesIndex="0"
:isCache="false">
</BaseEcharts>
事件调用
内置了echarts所有鼠标交互事件, 其他属性或事件可通过实例对象 echartInstance() 调用;
例: echartsInstanche().clear() // 由于子组件获取实例异步的问题,向外暴露了一个返回实例的函数
使用方法:通过 ref 调用,注意一定要在dom元素渲染完成后调用,写在onMounted 或 nextTick中
<script setup lang="ts">
import {BaseEcharts} from "base-echarts";
import {onMounted, ref} from "vue";
let echarts = ref(null)
onMounted(() => {
// 点击事件调用
echarts.value.onClick( e => {
console.log(e);
})
// 或
echarts.value.echartsInstanche().on('click', function (e) {
console.log(e);
})
})
</script>
<template>
<BaseEcharts :options="options" ref="echarts"></BaseEcharts>
</template>
小版本不断更迭,烦请多多包涵,很多问题是是在使用中发现的,最近一次更新优化了tooltip跳动错乱的问题,
如果使用过程中没有遇到的问题,建议不要轻易升级
3.1.1
4 months ago
3.1.0
4 months ago
3.0.8
4 months ago
3.0.7
4 months ago
3.0.6
4 months ago
3.0.4
10 months ago
3.0.5
7 months ago
3.0.3
12 months ago
3.0.2
12 months ago
3.0.1
12 months ago
3.0.0
12 months ago
2.1.9
12 months ago
2.1.8
1 year ago
2.1.4
1 year ago
2.1.3
1 year ago
2.1.6
1 year ago
2.1.5
1 year ago
2.1.7
1 year ago
2.1.2
1 year ago
2.1.1
1 year ago
2.1.0
1 year ago
2.0.1
1 year ago
2.0.0
1 year ago
1.2.0
2 years ago
1.1.9
2 years ago
1.1.8
2 years ago
1.1.7
2 years ago
1.1.6
2 years ago
1.1.5
2 years ago
1.1.4
2 years ago
1.1.3
2 years ago
1.1.2
2 years ago
1.1.1
2 years ago
1.1.0
2 years ago
1.0.1
2 years ago
1.0.0
2 years ago
0.0.0
2 years ago