ECHARTS异步加载的写法

简介: ECHARTS异步加载的写法
<div id="myChart" style="width:400px;height:300px;margin:auto;"></div>
  <script type="text/javascript">
    var myChart = echarts.init(document.getElementById('myChart'));
    $.get('http://api.lwpoor.cn/echarts/getjson').done(function (resule) {
      //resule = JSON.parse(resule);//把string字符串转换为json数组
      myChart.setOption({
        title: {
          text: '异步数据加载示例'
        },
        tooltip: {},
        legend: {
          data:['销量']
        },
        xAxis: {
          data: resule.Result.name
        },
        yAxis: {},
        series: [{
          name: '销量',
          type: 'bar',
          data: resule.Result.value
        }]
      });
    });
  </script>


{"State":1,"Message":"成功","Result":{"name":["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"],"value":[5,20,36,10,10,20]}}
相关文章
|
JSON JavaScript 前端开发
Echarts高级进阶教程(2):appendData异步加载大数据量分片加载数据和增量渲染的解决方案
Echarts高级进阶教程(2):appendData异步加载大数据量分片加载数据和增量渲染的解决方案
1201 0
|
数据可视化
Echarts高级进阶教程(3):appendData大数据量分片加载数据增量渲染和常规思路异步加载数据的对比,对折线图是无效的
Echarts高级进阶教程(3):appendData大数据量分片加载数据增量渲染和常规思路异步加载数据的对比,对折线图是无效的
489 0
|
前端开发
Echarts实战案例代码(21):front-endPage的CJJTable前端分页插件ajax分页异步加载数据的解决方案
Echarts实战案例代码(21):front-endPage的CJJTable前端分页插件ajax分页异步加载数据的解决方案
99 0
|
JSON 前端开发 测试技术
Echarts高级进阶教程(1):异步加载大量数据导致dataZoom组件拖动缩放时间轴卡顿的sampling降采样策略解决方案
Echarts高级进阶教程(1):异步加载大量数据导致dataZoom组件拖动缩放时间轴卡顿的sampling降采样策略解决方案
848 1
|
JSON JavaScript 数据格式
echarts读取excle转为json格式显示图表异步加载数据的方法(2)
echarts读取excle转为json格式显示图表异步加载数据的方法(2)
127 0
Echarts雷达图异步加载数据实例
Echarts雷达图异步加载数据实例
76 0
|
数据可视化 前端开发 JavaScript
【中级ECharts技术】 ECharts对于图表的使用,以及异步加载的特性{数据可视化利器}
【中级ECharts技术】 ECharts对于图表的使用,以及异步加载的特性{数据可视化利器}
【中级ECharts技术】 ECharts对于图表的使用,以及异步加载的特性{数据可视化利器}
|
3月前
|
小程序 前端开发 JavaScript
微信小程序图表制作利器:ECharts组件的使用与技巧
微信小程序图表制作利器:ECharts组件的使用与技巧
99 1
|
3月前
|
JavaScript
vue中使用echarts绘制双Y轴图表时,刻度没有对齐的两种解决方法
vue中使用echarts绘制双Y轴图表时,刻度没有对齐的两种解决方法
663 0
|
4月前
|
Web App开发 数据可视化 前端开发
Echart的使用初体验,Echarts的基本使用及语法格式,简单图表绘制和使用及图例添加【学习笔记】
本文介绍了ECharts的基本使用和语法格式,包括如何引入ECharts、创建容器、初始化echarts实例对象、配置option参数和一些基础图表的绘制方法。文章还提供了简单图表绘制和使用图例添加的示例代码,以及对ECharts特性和优势的概述。
Echart的使用初体验,Echarts的基本使用及语法格式,简单图表绘制和使用及图例添加【学习笔记】
下一篇
开通oss服务