`

sencha touch 集成百度 Echarts

阅读更多

下载百度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;

 最终效果:



 

 

分享到:
评论

相关推荐

    touch-docs-2.2.1.zip(senchaTouch 离线API参考文档)

    Sencha Touch 是一款专为移动设备开发的前端框架,它提供了丰富的组件和API,使得开发者可以轻松构建跨平台的触控应用。这个压缩包“touch-docs-2.2.1.zip”包含了Sencha Touch 2.2.1版本的离线API参考文档,对于...

    Sencha 和 Sencha Touch 简介

    本文通过对 Sencha Touch 框架的介绍,使读者对该框架有一定的了解,并通过一些代码示例给用户更详细直观的对 Sencha Touch 框架功能的了解。 ExtJS ExtJS 是为 web 开发人员提供的基于 JavaScript 和 web 标准快速...

    sencha touch在VScode上的插件

    总的来说,Sencha Touch在VScode上的插件是为了提高开发者的生产力,通过与VSCode的深度集成,使得编写Sencha Touch应用变得更加便捷和高效。通过安装和使用这个插件,开发者可以在熟悉的VSCode环境中享受到专门为...

    sencha touch 登陆界面

    Sencha Touch 是一款专为移动设备设计的JavaScript框架,它提供了丰富的组件库和强大的数据管理功能,用于构建高性能的触控应用。"sencha touch 登陆界面"这个主题,主要涉及的是如何使用Sencha Touch来设计和实现一...

    Sencha Touch in Action

    《Sencha Touch in Action》是一本关于使用Sencha Touch进行跨平台移动开发的书籍,它详细介绍了Sencha Touch框架的使用方法和技巧。Sencha Touch是一个利用HTML5、CSS3和JavaScript创建移动Web应用程序的框架,它是...

    Sencha Touch开发的项目《般若人生》源码

    《般若人生》是一款基于Sencha Touch框架开发的移动应用项目。Sencha Touch是一个流行的JavaScript框架,专门用于构建跨平台的触屏友好型Web应用程序。它提供了丰富的UI组件和强大的数据管理工具,使得开发者能够...

    一个完整的sencha touch 应用案例

    Sencha Touch 是一款专为移动设备设计的前端框架,它提供了丰富的组件库和强大的数据管理功能,用于构建高性能的触控应用。这个压缩包文件包含了创建一个完整的Sencha Touch 应用所需的基本元素,让我们逐一解析这些...

    sencha touch项目源码

    Sencha Touch 是一款专为移动设备设计的前端框架,它提供了丰富的组件和API,用于构建交互式的、响应式的Web应用程序。这个项目源码是基于Sencha Touch开发的一个实例,通过研究这个项目,我们可以深入理解Sencha ...

    sencha touch 2.4.0最新版

    Sencha Touch 2.4.0 是一个专为移动设备设计的前端JavaScript框架,它使得开发者能够构建功能丰富的、响应式的Web应用程序,这些应用在智能手机、平板电脑等移动设备上表现得如同原生应用一样流畅。这个框架由Sencha...

    Sencha Touch2环境搭建

    Sencha Touch 2是一款专为移动设备开发的前端框架,用于构建高性能的触控应用程序。它提供了丰富的组件库,使得开发者能够轻松创建出与原生应用相似的用户体验。本篇文章将详细阐述如何搭建Sencha Touch 2的开发环境...

    sencha touch list demo

    Sencha Touch 是一款专为移动设备设计的前端框架,它提供了丰富的组件库,用于构建高性能的触屏Web应用。在“sencha touch list demo”中,我们主要关注的是Sencha Touch中的列表(List)组件,这是一个核心且常用的...

    senchaTouch和fusioncharts结合的实例

    Sencha Touch 和 FusionCharts 的结合使用,是一种在移动设备上创建交互式图表和图形的高效方式。Sencha Touch 是一个流行的JavaScript框架,专门用于构建触摸优化的移动Web应用程序,而FusionCharts则是一款强大的...

    sencha touch中文翻译文档

    Sencha Touch是一款强大的JavaScript框架,专门用于构建移动Web应用程序。它提供了一套完整的UI组件和交互功能,使得开发者能够创建出具有原生应用体验的触摸友好型应用。这个"Sencha Touch中文翻译文档"是针对...

    api.zip_sencha _sencha touch api_sencha touch2 api

    标题中的"api.zip_sencha _sencha touch api_sencha touch2 api"表明这是一个关于Sencha Touch API的压缩文件集合,可能包含了Sencha Touch和Sencha Touch 2两个版本的API文档。 **Sencha Touch基础知识** Sencha ...

    Sencha Touch2 MVC Demo (含源码/数据库)

    Sencha Touch 2 是一个流行的JavaScript框架,专为构建移动Web应用程序而设计。它提供了丰富的UI组件、数据管理和触摸事件处理,使得开发者可以创建与原生应用类似的交互体验。MVC(Model-View-Controller)架构模式...

    sencha touch sdk工具

    Sencha Touch SDK工具是开发移动应用的重要资源,尤其对于那些希望使用Sencha Touch框架构建触控友好、跨平台Web应用程序的开发者来说。Sencha Touch是一个强大的JavaScript库,它提供了丰富的UI组件和API,使得...

    sencha-touch-1.0.1a.zip_Sencha Touch _sencha touch api_touch

    Sencha Touch 是一款专为移动设备设计的前端框架,它为开发者提供了构建触控友好的、高性能的Web应用程序的能力。1.0.1a是这个框架的一个早期版本,虽然现在可能已被更新版本所取代,但对于了解其发展历史和技术原理...

    sencha touch动态加载组件

    Sencha Touch是一款强大的移动应用开发框架,主要用于构建高性能的触屏友好型Web应用程序。它提供了丰富的组件库,使得开发者能够创建复杂、互动性极强的移动应用。在处理大型或内容丰富的应用时,动态加载组件成为...

Global site tag (gtag.js) - Google Analytics