实例首页
自学教程
IT工具箱
源代码
下载代码
上下布局
点击运行 >
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>ECharts 5 数据转换器 sort 实例</title> <!-- 引入 echarts.js --> <script src="https://cdn.staticfile.org/echarts/5.4.3/echarts.min.js"></script> </head> <body> <!-- 为 ECharts 准备一个定义了宽高的 DOM --> <div id="main" style="width: 600px;height:400px;"></div> <script type="text/javascript"> // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('main')); var option; option = { dataset: [ { dimensions: ['name', 'age', 'profession', 'score', 'date'], source: [ ['Hannah Krause', 41, 'Engineer', 314, '2011-02-12'], ['Zhao Qian', 20, 'Teacher', 351, '2011-03-01'], ['Jasmin Krause ', 52, 'Musician', 287, '2011-02-14'], ['Li Lei', 37, 'Teacher', 219, '2011-02-18'], ['Karle Neumann', 25, 'Engineer', 253, '2011-04-02'], ['Adrian Groß', 19, 'Teacher', '-', '2011-01-16'], ['Mia Neumann', 71, 'Engineer', 165, '2011-03-19'], ['Böhm Fuchs', 36, 'Musician', 318, '2011-02-24'], ['Han Meimei', 67, 'Engineer', 366, '2011-03-12'] ] }, { transform: { type: 'sort', config: { dimension: 'score', order: 'desc' } } } ], xAxis: { type: 'category', axisLabel: { interval: 0, rotate: 30 } }, yAxis: {}, series: { type: 'bar', encode: { x: 'name', y: 'score' }, datasetIndex: 1 } }; option && myChart.setOption(option); </script> </body> </html>
运行结果: