Echarts3.0：实现一个页面放多个Echarts图表的方法

最新推荐文章于 2024-01-05 16:07:35 发布

八千部下

最新推荐文章于 2024-01-05 16:07:35 发布

阅读量1.5w

点赞数 6

分类专栏：前端

本文链接：https://blog.csdn.net/caicai89tu/article/details/52226168

版权

前端专栏收录该内容

10 篇文章 0 订阅

订阅专栏

在Echarts3.0下，一个页面放多个Echarts图表变得非常简单，下面是一种在一个页面放置多张echarts图的方法。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>
    <!-- 引入 echarts.js -->
    <script src="echarts.min.js"></script>
</head>
<body>
    <!-- 第一个图表 -->
    <div id="first" style="width: 600px;height:400px;"></div>
    <!-- 第二个图表 -->
    <div id="second" style="width: 600px;height:400px;"></div>
</body>
</html>
<script type="text/javascript">
// ------配置图表1，各个性化图表配置方法详见官网-----
    var firstChart = ec.init(document.getElementById("first"));
    var option = {};
    firstChart.setOption(option);

// -----配置图表2-----
    var secondChart = ec.init(document.getElementById("second"));
    option={};
    secondChart.setOption(option);
</script>

优惠劵

八千部下

关注关注

6
点赞
踩
38

收藏

觉得还不错? 一键收藏
5
评论
Echarts3.0：实现一个页面放多个Echarts图表的方法

在Echarts3.0下，一个页面放多个Echarts图表变得非常简单，下面是一种在一个页面放置多张echarts图的方法。<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>ECharts</title>  <script src="echarts.min
复制链接

扫一扫