Echarts公用代码的变量统一封装调用

简介: Echarts公用代码的变量统一封装调用

在Echarts中,有些属性是通用的属性,如果在组件中重复使用,不便于调整且容易造成代码冗余,建议使用变量,然后统一传入。

使用示例如下:

定义变量

var labelRight = {
    normal: {
        position: 'right'
    }
};


统一调用

data: [{
        value: -0.07,
        label: labelRight
    },
    {
        value: -0.09,
        label: labelRight
    },
    {
        value: -0.23,
        label: labelRight
    },
    {
        value: -0.17,
        label: labelRight
    },
    {
        value: -0.36,
        label: labelRight
    }
]

Done !


相关文章
|
7月前
若依框架 --- echarts 封装
若依框架 --- echarts 封装
365 0
|
JavaScript
自行封装的tabs组件配合echarts而出现的bug以及解决
自行封装的tabs组件配合echarts而出现的bug以及解决
212 0
|
定位技术 数据格式
Echarts实战案例代码(59):geomap实现飞线、散点、引导线以及重叠label的解决
Echarts实战案例代码(59):geomap实现飞线、散点、引导线以及重叠label的解决
648 0
|
5天前
一文带你封装Vue3 Echarts
一文带你封装Vue3 Echarts
一文带你封装Vue3 Echarts
|
2月前
|
资源调度 JavaScript API
vue-element-admin 综合开发五:引入 echarts,封装echarts 组件
这篇文章介绍了如何在vue-element-admin项目中引入并封装ECharts组件,以及如何实现折线图、柱状图和饼图的展示。
129 4
vue-element-admin 综合开发五:引入 echarts,封装echarts 组件
|
2月前
|
XML 前端开发 数据格式
echarts柱图前后端代码SpringCloud+Vue3
echarts柱图前后端代码SpringCloud+Vue3
59 1
|
4月前
|
前端开发 数据可视化 JavaScript
【揭秘神器】如何用Pyecharts轻松召唤出Echarts?只需几行Python代码,让你的数据瞬间生动起来!
【8月更文挑战第21天】Pyecharts是一款基于Python的图表生成库,利用Echarts强大的JavaScript可视化能力,让开发者无需编写前端代码即可在Python环境中创建美观图表。本文通过实例演示如何安装Pyecharts并生成一个展示城市气温分布的柱状图,包括基本图表生成及自定义样式设置,如颜色调整、图例显示等,最终将图表嵌入HTML文件展示,适合各水平开发者快速掌握数据可视化技能。
62 0
这样封装echarts简单好用
这样封装echarts简单好用
|
7月前
|
前端开发 JavaScript 定位技术
Docusaurus框架——react+antd+echarts自定义mdx生成图表代码解释文档
Docusaurus框架——react+antd+echarts自定义mdx生成图表代码解释文档
691 0
|
7月前
|
前端开发 JavaScript
React中封装echarts图表组件以及自适应窗口变化
React中封装echarts图表组件以及自适应窗口变化
223 1

热门文章

最新文章