let colorArr = ['#FAD237', '#3469FC', '#9013FE', '#E5579A', '#34D129']; let gradientArr = ['250,210,55', '52,105,252', '144,19,254', '229,87,154', '52,209,41']; initLineChart(); // 图表调用并赋值 function initLineChart() { let data1 = { xAxisData: ['2012', '2013', '2014', '2015', '2016', '2017', '2018'], seriesData: [{ name: '实际用电曲线', data: [861, 559, 343, 604, 459, 728, 844] }, { name: '中长期聚合曲线', data: [533, 454, 360, 770, 607, 328, 449] }, { name: '长期聚合曲线', data: [461, 583, 421, 455, 515, 739, 583] }] }; basicLineChart1(this.$Echarts.init(document.getElementById('line1')), data1); ladderLineChart(this.$Echarts.init(document.getElementById('line2')), data1); setLineImgChart(this.$Echarts.init(document.getElementById('line3')), data1); basicLineChart2(this.$Echarts.init(document.getElementById('line4')), data1); } /** * 基础折线图 * @param chart:echart容器 * data: 折线图数据 */ export function basicLineChart1(chart, chartData) { let dataArr = []; for(let i = 0; i < chartData.seriesData.length; i ) { let obj = chartData.seriesData[i]; dataArr.push({ name: obj.name, type: 'line', symbolSize: 0, smooth: true, lineStyle: { color: 'rgb(' gradientArr[i] &
复制
Echarts实现折线图效果
转载请注明出处或者链接地址:https://www.qianduange.cn//article/24430.html
发布的文章
【Linux笔记】基础IO(上)
2025-03-27 13:03:40
Windows11离线安装wsl2(适用于 Linux 的 Windows 子系统)和Ubuntu
2025-03-27 13:03:39
Linux 服务器运维常用命令大全
2025-03-27 13:03:38
深入了解 Ubuntu 中的 build-essential:开发者的必备工具
2025-03-27 13:03:36
RagFlow Docker Desktop Ollama DeepSeek-R1本地部署自己的本地AI大模型工具
2025-03-27 13:03:35
Linux 学习必杀技:从菜鸟到高手的蜕变密码
2025-03-27 13:03:35
Trae AI 全新功能 SSHremote助力开发者个人产品打造,高效构建全栈应用
2025-03-27 13:03:34
Python Selenium全栈指南:从自动化入门到企业级实战
2025-03-27 13:03:33
Spring Cloud之负载均衡之LoadBalance
2025-03-27 13:03:33
【一篇搞定配置】一篇带你从配置到使用(PyCharm远程)完成服务器运行项目(配置、使用一条龙)【全网最详细版】
2025-03-27 13:03:33
大家推荐的文章