echarts动态加载data

最新推荐文章于 2024-10-08 08:40:47 发布

幻梦星空

最新推荐文章于 2024-10-08 08:40:47 发布

阅读量7k

点赞数 1

分类专栏： eclipse echarts jquery html

本文链接：https://blog.csdn.net/qq_25214695/article/details/50511974

版权

本文介绍了如何在Echarts中动态加载数据，特别是针对饼图的情况。通过JavaScript获取隐藏input中的值，利用split方法解析数据，然后构建Echarts饼图的data数组。示例代码展示了动态构建饼图系列数据的过程。

摘要由CSDN通过智能技术生成

第一：在开发中，我们经常会遇到data中的value和name需要进行循环才能显示，那么下面来说一下实现的方法：

以饼图为例：

   [#if aa??]
<input type="hidden" name="aa" id="aa" value="${aa!}"/>
[/#if]
[#if rrr??]
<input type="hidden" name="rrr" id="rrr" value="${rrr!}"/>
[/#if]
<script type="text/javascript">

// 路径配置
require.config({
paths: {
echarts: 'http://echarts.baidu.com/build/dist'
}
});

// 使用
require(
[
'echarts',
'echarts/chart/pie' // 使用柱状图就加载bar模块，按需加载
],
function (ec) {
// 基于准备好的dom，初始化echarts图表
var myChart = ec.init(document.getElementById('main'));

var option = {
title : {
text: '',
subtext: '',