ExtJs 画出图表

最新推荐文章于 2024-03-09 16:39:58 发布
最新推荐文章于 2024-03-09 16:39:58 发布
阅读量7.9k 收藏 2
点赞数
文章标签： Ext JS 布局 ExtJS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/diversity1/article/details/9618325
版权

ExtJs API地址 http://dev.sencha.com/deploy/ext-4.1.0-gpl/docs/index.html#!/example

今天心情不好，决定写博客，发泄发泄，进入主题

好吧，刚接触Extjs不久，发现ExtJs前台表现真的非常强大，最近看着api的例子，自己做了一张图表，再次总结一下

1)画图

Ext.define('POWERCONSUMPTIONGRAPHS.view.PowerConsumptionGraphsIndex' ,{
    extend: 'Ext.container.Container',
    alias : 'widget.powerconsumptiongraphsindex',
    layout:'border',
    // 初始化组件
    initComponent: function() {
    	this.items = [this.createQueryFiled(),this.createLineChartArea()];
		this.callParent(arguments);//调用父类构造方法
    },
    /*--------------------------查询区域----------------------------*/
    createQueryFiled:function(){
    	var me = this;
    	//组件缓存queryField供生成实例时访问
    	me.queryFieldForm = Ext.create("Ext.form.Panel",{
    		id:'graphsQueryFieldForm',
    		name:'graphsQueryFieldForm',
    		region:'north',
    		height:120,
    		margin:1,
    		tbar: [
		    	{xtype:'button',text:wake.t("dxic","ext","dxic.indexQuery"),id:'reportQuery',iconCls:wake.CSS.queryImage},'-',
	    	    {xtype:'button',text:wake.t("dxic","ext","dxic.indexReset"),id:'reportClear',iconCls:wake.CSS.resetImage}
    	    	],
    	    defaults: {
				labelWidth:105
				,padding:'3 5'
				,columnWidth:0.25
				,xtype:'textfield'
				,labelAlign:'right'
	        }
    		,layout: "column"
    		,items:[
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.startYearDate"),afterLabelTextTpl:wake.TEXT.redStar,id:'indexStartYearDate', name:"startYearDate",xtype:'wakemonthfield',format:'Y',editable:false},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.endYearDate"),afterLabelTextTpl:wake.TEXT.redStar,id:'indexEndYearDate',name:"endYearDate",xtype:'wakemonthfield',format:'Y',editable:false},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.monthYearDate"),afterLabelTextTpl:wake.TEXT.redStar,id:'indexMonthYearDate',name:"monthYearDate",xtype:'wakemonthfield',format:'Y',editable:false,hidden:true},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.area"), id:'indexAreaName',name:"areaName",viewClassName:'areaselect',xtype:'waketextwindow'},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.area"), id:'indexAreaCompleteCode',name:"areaCompleteCode",hidden:true},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.manualGroupName"), id:'indexManulGroupName',name:"manualGroupName", xtype:'wakecombobox', dictUrl:'com.beiyanght.dxic.dxms.domain.autogroup.AutoGroup.getAutoGroup', editable:false,hidden:true},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.autoGroupName"), id:'indexAutoGroupName',name:"autoGroupName", xtype:'wakecombobox', dictUrl:'com.beiyanght.dxic.dxms.domain.autogroup.AutoGroup.getAutoGroup', editable:false,hidden:true},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.roadSide"), id:'indexRoadSide',name:"roadSide",xtype:'wakecombobox', dictUrl:'com.beiyanght.dxic.dxms.domain.masterdata.MasterData.findRoadSide', editable:false},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.sequence"), id:'indexSequence',name:"sequence",xtype:'numberfield',minValue:0,mouseWheelEnabled:false},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.zigbee"), id:'indexZigbee',name:"zigbee"},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.phone"), id:'indexGateWayNumber',name:"gateWayNumber"},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.gateWayName"), id:'indexGateWayName',name:"gateWayName"},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.number"), id:'indexNumber',name:"number"},
	    		{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.lampType"), id:'indexLampType',name:"lampType", xtype:'wakecombobox', dictUrl:'com.beiyanght.dxic.dxms.domain.equipment.LampType.getAllLampType', editable:false},
				{	id:'indexRadioGroup',
					name:"yearOrMonth",
			        xtype: 'radiogroup',
			        fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.category"),
			        columns: 2,
			        vertical: true,
			        items: [
			            { boxLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.year"), name: 'yearOrMonth', inputValue: '1' ,id:'radioYear',checked: true},
			            { boxLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.queryFieldForm.month"), name: 'yearOrMonth', inputValue: '2' ,id:'radioMonth'}
			        ]
			    }
				]
    	});
    	return me.queryFieldForm;
    }
    ,createLineChartArea:function(){
    	var me = this;
    	//创建图表区域
    	me.lineChartArea = Ext.create("Ext.form.Panel",{
    		region:'center',
    		layout: "border"
    		,items:[
    		this.createLineChart(),this.createSumForm()
				]
    	});
    	return me.lineChartArea;
    }
    ,createLineChart:function(){
    	var me = this;
//	折线图实例
//    	me.yearLineChart = Ext.create('Ext.chart.Chart', {
//		    renderTo: Ext.getBody(),
//		    id:'indexYearLineChat',
//    		name:'indexYearLineChat',
		    width: 100,
		    height: 100,
//		    region:"center",
		    margin:'0 2 0 0',
//		    animate: true,
//		    store: Ext.create('POWERCONSUMPTIONGRAPHS.store.PowerConsumptionGraphsYearStore'),
//		    axes: [
//		        {
//		            type: 'Numeric',
//		            position: 'left',
//		            fields: ['yearConsumptionData'],
		            label: {
		                renderer: Ext.util.Format.numberRenderer('1,100')
		            },
//		            title: '总耗电量（KW/h）',
//		            grid: true,
//		            minorTickSteps: 1,
//		            minimum: 0
//		        },
//		        {
//		            type: 'Category',
//		            position: 'bottom',
//		            fields: ['yearName'],
//		            title: '年'
//		        }
//		    ],
//		    series: [
//		        {
//		            type: 'line',
//		            highlight: {
//		                size: 7,
//		                radius: 7
//		            },
//		            axis: 'left',
//		            xField: 'yearName',
//		            yField: 'yearConsumptionData',
//		            markerConfig: {
//		                type: 'cross',
//		                size: 4,
//		                radius: 4,
//		                'stroke-width': 0
//		            }
//		        }
//		    ]
//		});
//	   柱状图实例
    	    me.yearLineChart = Ext.create('Ext.chart.Chart', {
            id: 'indexYearLineChat',
            xtype: 'chart',
//          style: 'background:#fff',
            animate: true,
            width:600,
            maxWidth:600,
            minHeight:260,
            margin:100,
            region:"west",
            shadow: true,
            store: Ext.create('POWERCONSUMPTIONGRAPHS.store.PowerConsumptionGraphsStore'),
            axes: [{
                type: 'Numeric',
                position: 'left',
                fields: ['consumptionData'],
                label: {
//                    renderer: Ext.util.Format.numberRenderer('0,0')
                },
                title: 'POWER CONSUMPTION ( kw / h )',
                grid: true,
                minimum: 0
            }, {
                type: 'Category',
                position: 'bottom',
                fields: ['name'],
                title: 'Year Or Month'
            }],
            series: [{
                type: 'column',
                axis: 'left',
                highlight: true,
                tips: {
                  trackMouse: true,
                  width: 150,
                  height: 28,
                  renderer: function(storeItem, item) {
                    this.setTitle(storeItem.get('name') + ': ' + storeItem.get('consumptionData') + 'kw/h');
                  }
                },
                label: {
                  display: 'insideEnd',
                  'text-anchor': 'middle',
                    field: 'consumptionData',
                    renderer: Ext.util.Format.numberRenderer('0'),
                    orientation: 'vertical',
                    color: '#333'
                },
                xField: 'came',
                yField: 'consumptionData'
            }]
        });
		return me.yearLineChart;
    },
        //初始化企业管理明细
	createSumForm:function(){
    	//组件缓存queryField供生成实例时访问
		this.sumForm = Ext.create("Ext.form.Panel",{
    		id:'indexSumForm'
    		,name:'indexSumForm'
    		,region:'south'    		
    		,margin:10
    		,height:100
    		,width:300
	    	,defaults: {
				labelWidth:120				
				,padding:'3 5'
				,columnWidth:0.5
				,xtype:'textfield'
				,labelAlign:'right'
        	}
    		,layout: "column"
    		,items:[ 
    			{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.sumForm.sumConsumption"),name:'sumConsumption'}					
                ,{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.sumForm.avgConsumption"),name:'avgConsumption'}
				,{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.sumForm.maxConsumption"),name:'maxConsumption'}
				,{fieldLabel: wake.t("dxic","powerconsumptionstatic","PowerConsumptionStaticIndex.sumForm.minConsumption"),name:'minConsumption'}
				]
		});
    	return this.sumForm;
	}
});


2）后台查询ctrl 

// 资源请求路径
var path = "powerConsumptionGraphs/";
Ext.define('POWERCONSUMPTIONGRAPHS.controller.PowerConsumptionGraphsCtrl',{
	extend:'Ext.app.Controller',
	views:['PowerConsumptionGraphsIndex'],
	init:function(){
		this.control({
		/**--------------------index界面方法---------------------**/
			//检索
			'#reportQuery':{click:this.indexQuery},
			//清空
			'#reportClear':{click:this.indexReset},
			//单选按钮触发事件
			'#indexRadioGroup':{change:this.changeRadio},
			//区域弹窗
			'areaselect':{selectitem:this.selectReturn}
		});
	}
	,selectReturn:function(data,callerId,caller){
    	if(Ext.isEmpty(callerId)){
    		
    	}
    	else if(callerId=="indexAreaName"){
    		Ext.getCmp("indexAreaName").setValue(data.get("areaName"));
			Ext.getCmp("indexAreaCompleteCode").setValue(data.get("completeCode"));
    		Ext.getCmp("indexAreaName").win.close();
    	}

    },
	//单选按钮触发事件
	changeRadio:function(field, newValue, oldValue, eOpts ){
		//如果是按年查询
		if(newValue.yearOrMonth=="1"){
			Ext.getCmp("indexStartYearDate").setVisible(true);
			Ext.getCmp("indexEndYearDate").setVisible(true);
			Ext.getCmp("indexMonthYearDate").setVisible(false);
		}else if(newValue.yearOrMonth=="2"){
			Ext.getCmp("indexStartYearDate").setVisible(false);
			Ext.getCmp("indexEndYearDate").setVisible(false);
			Ext.getCmp("indexMonthYearDate").setVisible(true);
		}else {
			//
		}
	},
	//查询
	indexQuery:function(){
		//如果为选择类型
		//选择年，就必须填写起始年和种植年
		console.info(Ext.getCmp("radioMonth").getValue());
		if(Ext.getCmp("radioYear").getValue()){
			startYearDate = Ext.util.Format.date(Ext.getCmp("indexStartYearDate").getValue(),'Y');
			endYearDate = Ext.util.Format.date(Ext.getCmp("indexEndYearDate").getValue(),'Y');
			if (Ext.isEmpty(startYearDate) || Ext.isEmpty(endYearDate)) {
				Ext.Msg.alert(wake.t("dxic","ext","dxic.operateInfo"), wake.t("dxic","ext","dxic.fillStartDateAndEndDate"));
				return;
			}else if(startYearDate > endYearDate){
				Ext.Msg.alert(wake.t("dxic","ext","dxic.operateInfo"), wake.t("dxic","ext","dxic.startDateMoreThanEndDate"));
				return;
			}
		}else if(Ext.getCmp("radioMonth").getValue()){
			monthYearDate = Ext.getCmp("indexMonthYearDate").getValue();
			if (Ext.isEmpty(monthYearDate)) {
				Ext.Msg.alert(wake.t("dxic","ext","dxic.operateInfo"), wake.t("dxic","ext","dxic.fillYear"));
				return;
			}
			
		}
		// 获取select界面，开启遮罩层
		var powerConsumptionGraphsIndex = Ext.getCmp("powerConsumptionGraphsIndex");
		powerConsumptionGraphsIndex.setLoading(true);
		//获取图表|获取form
    	var indexYearLineChat = Ext.getCmp("indexYearLineChat");
    	var indexSumForm = Ext.getCmp("indexSumForm");
		//获取查询条件
		var condition = wake.getContainerValues(powerConsumptionGraphsIndex.queryFieldForm);
		//创建路径
		var url = restPath+path+"findConsumptionByCondition"+"?condition="+Ext.JSON.encode(condition);
    	//组装请求对象，并调用框架的请求方法发送请求
		wake.ajax({
			contentType:'application/json',
    		dataType:'json',
    	    type: "GET",//获取信息用GET|新增、更改信息用POST|删除信息用DELETE|修改一个资源用PUT
    	    url: url,
    	    timeout:30000,//超时连接
    	    success:function(data){
    	    	if(data){
    	    		//将查询出的内容填充的grid中去
    	    		console.info(data);
    	    		indexYearLineChat.getStore().loadData(data.dataList);
    	    		wake.setContainerValues(powerConsumptionGraphsIndex.sumForm,data);
    	    	}
    	    	//取消遮罩
    	    	powerConsumptionGraphsIndex.setLoading(false);
    			wake.showMessage(wake.t("dxic","ext","dxic.querySuccess"));
    	    },
    	    error:function(){
    	    	powerConsumptionGraphsIndex.setLoading(false);
    			wake.showMessage(wake.t("dxic","ext","dxic.queryFailed"));
    		}
		});
	},
	
	//重置
	indexReset:function(){
		//获取form容器
		Ext.getCmp("graphsQueryFieldForm").getForm().reset();
	}

});
注意其中的radiogroup控件，可以控制界面变换 
//单选按钮触发事件
			'#indexRadioGroup':{change:this.changeRadio}

下面看看效果图吧

--------ExtJsの画图表.png




diversity1
关注
Extjs4 动态生成图表chart（从后台传数据动态显示）
小新新的专栏
05-20 6431
做项目，需要搞一个图表，从后台的数据库中统计出数据再传到前台来。搞了几个钟头，都不能实现功能。数据是传到了前台，可是图表总是显示不了，如果用静态数据的话，图表显示成功。上网查了很多资料，这方面的资料也不错，看来大家出现这个问题不多，那么就应该很好解决的。看了有同样问题的网页，有的说是是数据还没有加载到Store里面，图表就生成了，没有数据，所以没有显示，因此我又搞了个数据加载成功的回调函数，还是只
Ext JS 6学习文档-第7章-图表
weixin_30314793的博客
08-24 298
Ext JS 6学习文档-第7章-图表 使用图表 本章中将探索在 ExtJS 中使用不同类型的图表并使用一个名为费用分析的示例项目结束本章所学。以下是将要所学的内容： 图表类型 条形图 和 柱形图 图表 区域 和 折线 图表 饼图 图表 3 D 图表 费用分析 – 示例项目 图表 在第一章中提过，我说 ExtJS 是一站式的几乎能满足你对所有的 JavaScript...
ExtJS图表
张晨光老师的播客
03-24 1791
1.1 学习技能点 本次在线学习将学习以下知识技能：Ø 柱状图Ø 饼状图Ø 折线图1.2 学习任务ExtJS3使用的Flash Chart来源于YUI，其中包括柱状图、饼状图等多种图表，这些图表可以与ExtJS组件完美整合，不仅可以在Panel中显示图表，还可以通过Store为图表提供数据。1.2.1 任务1：使用柱状图统计每月的访问人数需求说明首先定义一个JsonStroe为我们要实现的图表提供
extjs 图表的一个例子
yu3000的专栏
02-07 314
http://dev.sencha.com/ext/5.1.0/examples/kitchensink/#widget-grid
Ext.js组件:Chart 图表
qq_36987708的博客
01-10 1875
图表用于以图形格式表示数据。 以下是Ext JS提供的不同图表： 编号 图表 1 Pie Chart 由于名称表示此图表用于以饼图格式表示数据。 2 Line Chart 此图表用于以线图格式表示数据。 3 Bar Chart 此图表用于以条形图格式表示数据。 4 Area Chart 此图表用于以面积...
Extjs4Charts图表
11-04
ExtJS 4 是一款强大的JavaScript框架，用于构建富客户端应用程序。...提供的"Extjs4Charts图表"压缩包文件应该包含了预设的图表示例，可以直接运行查看效果，对于初学者来说，这是一个很好的学习资源。
extjs4图表绘制之折线图实现方法分析
10-15
本文将深入探讨EXTJS4中绘制折线图的实现过程，包括从后端获取数据、设置图表配置以及响应用户交互。 首先，EXTJS4提供了丰富的图表组件，使得开发者能够方便地构建各种类型的图表，如折线图、柱状图、饼图等。在...
extjs图表绘制之条形图实现方法分析
10-15
在EXTJS中，绘制图表是实现数据可视化的重要方式，尤其对于条形图，它能直观地展示分类数据的比较情况。本篇文章将深入探讨EXTJS如何实现条形图的绘制，包括从后端请求数据、展示每月人数以及自定义条形颜色等关键...
extjs 图表展示代码
04-03
ExtJS 是一个强大的...总之，ExtJS 4的图表功能强大且灵活，能够帮助开发者构建出专业级的数据可视化应用。通过学习和实践，你可以轻松地将数据转化为生动、有洞察力的图表，从而提升用户体验和数据分析的效率。
ExtJS提供了丰富的图表和数据可视化组件，可以轻松地将数据以图形方式展示出来，使用户更直观地理解数据
最新发布
BLOG域名:programb.blog.csdn.net
03-09 334
ExtJS是一个功能强大的JavaScript框架，它提供了丰富的图表和数据可视化组件，可以帮助开发人员轻松地将数据以图形方式展示出来，使用户更直观地理解数据。通过使用ExtJS的图表和数据可视化组件，开发人员可以根据自己的需求创建各种类型的图表，如柱状图、折线图、饼图等。数据可视化：ExtJS提供了丰富的图表和数据可视化组件，可以轻松地将数据以图形方式展示出来，使用户更直观地理解数据。表单处理：ExtJS具有强大的表单处理功能，可以快速创建复杂的表单，并进行验证、提交等操作。
EXtjs 统计图 饼图 直方图 和折线图
05-18
Extjs 统计图 饼图 直方图 和折线图
extjs 图表制作
03-25
Extjs 制作各种统计图
extjs小图标(项目小图标大全)
10-12
extjs小图标(项目小图标大全)
柱状图-ext
09-16
柱状图-ext
结合extjs + mxgraph 网络拓扑图的开发
06-26
extJs 跟mxgraph一样都是一种前台框架，可以混着用，这个例子将结合extjs + mxgraph 做网络拓扑图。mxgraph是将html的页面元素当做一个容器（container），并在此容器中画图的，而extJs也是将此容器包装成一个window的，因此页面的容器就是它们的结合点。
ExtJS6图表简单demo(折线图，散点图，柱状图)
taizhimin
06-27 7110
ExtJS6图表简单demo(折线图，散点图，柱状图)首先需要引入这三个文件，都懂 <link rel="stylesheet" type="text/css" href="build/classic/theme-triton/resources/theme-triton-all.css" /> <script type="text/javascript" src="bui
[Ext JS 4] 组件之图表
oscar999的专栏
07-21 7441
前言 图表用来更直观的呈现数据，通常它可以很好的呈现出数据之间的关系。 在Ext JS 4中， 图表的类使用绘图包开发的surfaces(表面)和sprites(精灵)。 这也就说，它们的底层技术都是SVG, VML 或 HTML 5 Canvas 的绘图技术。 每一个图表必须要三个组成部分： 数据(data), 轴(axes)和系列(Series)。 数据 -  是图表用来展示的信息，在
extjs4图表--折线图
程序媛-jjl的博客
12-28 2421
本篇文章将介绍extjs中自带的图表 在本次案例中，提供一下功能： 1.从后端请求数据并运用到图表中，形成动态数据。 2.查询出每年各个月中人数。 请看下面代码： Ext.define('ChartLineTest', { extend: 'Ext.panel.Panel', autoScroll : true, selectYear:null,//定义年
EXTJS 4 chart图表样式汇总
u013127751的博客
06-13 1816
theme: 'Category1' theme: 'Category2' theme: 'Category3' theme: 'Category4' theme: 'Category5' theme: 'Category6' theme: 'base' theme: 'Green' theme
extjs 画多列柱状图
06-09
好的，您可以使用 ExtJS 中的 `Ext.chart.series.Bar` 类来创建多列柱状图。以下是一个示例代码，展示如何在 ExtJS 中创建一个多列柱状图： ```javascript Ext.create('Ext.chart.Chart', { renderTo: Ext.getBody(), width: 400, height: 300, store: { fields: ['name', 'data1', 'data2', 'data3'], data: [ { name: 'A', data1: 10, data2: 20, data3: 30 }, { name: 'B', data1: 20, data2: 30, data3: 40 }, { name: 'C', data1: 30, data2: 40, data3: 50 }, { name: 'D', data1: 40, data2: 50, data3: 60 } ] }, axes: [ { type: 'numeric', position: 'left', fields: ['data1', 'data2', 'data3'], title: '数值', grid: true, minimum: 0 }, { type: 'category', position: 'bottom', fields: ['name'], title: '类别' } ], series: [ { type: 'bar', xField: 'name', yField: ['data1', 'data2', 'data3'], stacked: false, title: ['数据1', '数据2', '数据3'], style: { opacity: 0.80 }, highlight: { fillStyle: 'yellow' }, tooltip: { trackMouse: true, renderer: function (tooltip, record, item) { tooltip.setHtml(record.get('name') + ': ' + item.field + ' = ' + record.get(item.field)); } } } ] }); ``` 在上面的代码中，我们首先创建了一个 `Ext.chart.Chart` 实例，并将其渲染到页面的 `body` 元素中。然后，我们定义了一个数据源，其中包含了每个类别的三个数据列。接下来，我们定义了两个坐标轴：一个是数值轴，用于显示数据列的值；另一个是类别轴，用于显示类别名称。最后，我们定义了一个柱状图系列，其中 `xField` 是类别名称，`yField` 是三个数据列名称的数组，`stacked` 属性设置为 `false`，因为我们不希望将数据列堆叠在一起。我们还设置了一些样式和工具提示，以便用户可以查看每个数据点的值。 请注意，您需要在 ExtJS 应用程序中加载 `Ext.chart.*` 和 `Ext.draw.*` 包，以便使用 ExtJS 的图表和绘图功能。
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值