echart折线图X轴三级不等分实例

最新推荐文章于 2023-11-01 16:25:23 发布

VIP文章 liucaifa2008

最新推荐文章于 2023-11-01 16:25:23 发布

阅读量1k

点赞数 1

分类专栏： html js Css 文章标签： html javascript js echarts

本文链接：https://blog.csdn.net/liucaifa2008/article/details/109677002

版权

效果图

代码如下：

<!DOCTYPE html>
<html style="height: 100%">
<head>
<meta charset="utf-8">
<style type="text/css">
.style1
{
color: #FF0000;
}
</style>
</head>

<body style="height: 100%; margin: 0">
<div id="container" style="height: 100%" class="style1"></div>

<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
<script type="text/javascript">
var dom = document.getElementById("container");
var myChart = echarts.init(dom);

srcData = [
{group: '测试三层1', subGroup: '测试二层1', name: 'a', value1: 11},
{group: '测试三层1', subGroup: '测试二层1', name: 'b', value1: 41},
{group: '测试三层1', subGroup: '测试二层2', name: 'C', value1: 16},
{group: '测试三层1', subGroup: '测试二层2', name: 'D', value1: 32},
{group: '测试三层1', subGroup: '测试二层2', name: 'E', value1: 34},
{group: '测试三层2', subGroup: '测试二层3', name: 1, value1: 12},
{group: '测试三层2', subGroup: '测试二层3', name: 2, value1: 35},
{group: '测试三层2', subGroup: '测试二层3', name: 3, value1: 23},
{group: '测试三层2', subGroup: '测试二层4', name: 2.3, value1: 16},
{group: '测试三层2', subGroup: '测试二层4', name: 4.5, value1: 12},
{group: '测试三层3', subGroup: '测试二层5', name: 5.2, value1: 11.}
];

covertData = function(src) {
var nameList = [];
var valueList = [];

var gr

最低0.47元/天解锁文章

liucaifa2008

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
1
评论
echart折线图X轴三级不等分实例

效果图代码如下：<!DOCTYPE html><html style="height: 100%"> <head> <meta charset="utf-8"> <style type="text/css"> .style1 { color: #FF0000; } </style>...
复制链接

扫一扫