下载百度echart:https://codeload.github.com/ecomfe/echarts/zip/2.2.6
解压将 echarts-2.2.6/build/dist/echarts-all.js 拷贝到 sencha touch项目根目录
修改 app.json 文件,将echarts-all.js引入 sencha项目中
这样就集成好了。在项目里可以先创建html标签来放入echart要绘制的id。
html:"<div id="echart" style="width:100%;height:250px;"></div>"
在页面初始化完成后调用echart绘图方法。
var myChart = echarts.init(document.getElementById('echart'));
var option = {
tooltip : {
trigger: 'axis'
},
toolbox: {
show : false,
feature : {
mark : {show: true},
dataView : {show: true, readOnly: false},
magicType: {show: true, type: ['line']},
restore : {show: true},
saveAsImage : {show: true}
}
},
calculable : true,
legend: {
data:['投资数','投资金额']
},
xAxis : [
{
type : 'category',
data : ['2005','2006','2007','2008','2009','2010','2011','2012','2013','2014','2015']
}
],
yAxis : [
{
type : 'value',
name : '投资数'
},
{
type : 'value',
name : '投资金额'
}
],
series : [
{
name:'投资数',
type:'line',
data:[2, 28, 30, 23, 18, 50, 64,27,55,143,51]
},
{
name:'投资金额',
type:'line',
yAxisIndex: 1,
data:[87.32, 791.92, 665.61, 1122.64, 1307.27, 1888.82, 3629.25,1197.16,2919.29,3614.21,1146.22],
}
]
};
// 为echarts对象加载数据
myChart.setOption(option);
window.onresize = myChart.resize;
最终效果: