ExtJs纵坐标值重复问题的解决方法


Posted in Javascript onFebruary 27, 2014

写在前面,版本库:Ext JS Library 3.3.1

做图表的时候纵坐标很多值都是一样的,无意中发现下面的解决方法,自己测试是可以了,写出来以备后查,以便他人查看。其他版本没测试过。有兴趣的朋友可以自己测试。

var chartStore;//图表数据 
Ext.onReady(function(){ //使用当前服务器的文件,如果没有这句话,默认会去adobe的站点取 
Ext.chart.Chart.CHART_URL = 'extjs/resources/charts.swf'; 
var json_reader = new Ext.data.JsonReader( { 
idProperty : "pointName", 
root : 'rows', 
totalProperty : "results", 
fields : [ { 
name : 'pointName' 
}, { 
name : 'faultCount', 
type : "int" 
}] 
}); 
//从后台取数据 
chartStore = new Ext.data.Store({ 
proxy : new Ext.data.HttpProxy({ 
url : 'loadColumnChart.do', 
method : 'POST' 
}), 
reader : json_reader 
}); 
chartStore.reload(); 
//柱状图面板 
var columnchartPanel = new Ext.Panel({ 
border :false, 
autoScroll : true, 
//title : '设备测点故障记录统计图', 
frame : true, 
renderTo : document.body, 
width: 800, 
height: 240, 
layout : 'fit', 
items : { 
xtype : 'columnchart', // 类型 
store : chartStore, 
xField : 'pointName', // X轴取值 
yField : 'faultCount', // Y轴取值 
yAxis : new Ext.chart.NumericAxis({ 
displayName : 'faultCount' 
//labelRenderer : Ext.util.Format.numberRenderer('0,0')//关键问题是这句,我把这句注释了就正常了 
}), 
tipRenderer : function(chart, record) { 
return record.data.pointName + '的故障次数为:' + 
Ext.util.Format.number(record.data.faultCount, '0,0'); 
}, 
series : [ {//列 
type : 'column', //类型可以改变(线)line 
displayName : 'faultCount', 
yField : 'faultCount', 
style : { 
color : 0x99BBE8 
} 
}] 
} 
}); 
//柱状图面板 
var leftPanel = new Ext.Panel({ 
title: '柱状图', 
region:'west', 
margins: '5 0 0 0', 
cmargins: '5 5 0 0', 
width: 850, 
minSize: 700, 
maxSize: 850, 
autoScroll:true,//设为true则内容溢出的时候产生滚动条,默认为false 
collapsible: true,//允许收缩 
items: columnchartPanel 
}); 
});

1.解决前:
ExtJs纵坐标值重复问题的解决方法 
2.解决后:
ExtJs纵坐标值重复问题的解决方法 
Javascript 相关文章推荐
JS 继承实例分析
Nov 04 Javascript
JS面向对象、prototype、call()、apply()
May 14 Javascript
火狐下table中创建form导致两个table之间出现空白
Sep 02 Javascript
通过url查找a元素应用案例
Apr 29 Javascript
jQuery中extend函数详解
Feb 13 Javascript
gameboy网页闯关游戏(riddle webgame)--仿微信聊天的前端页面设计和难点
Feb 21 Javascript
JS验证input输入框(字母,数字,符号,中文)
Mar 23 Javascript
Vue.js使用$.ajax和vue-resource实现OAuth的注册、登录、注销和API调用
May 10 Javascript
AngularJS表单验证功能
Oct 19 Javascript
js实现手机web图片左右滑动效果
Dec 29 Javascript
Vue.js分页组件实现:diVuePagination的使用详解
Jan 10 Javascript
微信小程序图表插件wx-charts用法实例详解
May 20 Javascript
flash遮住div问题的正确解决方法
Feb 27 #Javascript
浏览器窗口加载和大小改变事件示例
Feb 27 #Javascript
js中settimeout方法加参数的使用实例
Feb 27 #Javascript
回车直接实现点击某按钮的效果即触发单击事件
Feb 27 #Javascript
Ajax请求在数据量大的时候出现超时的解决方法
Feb 27 #Javascript
jQuery的live()方法对hover事件的处理示例
Feb 27 #Javascript
类似天猫商品详情随浏览器移动的示例代码
Feb 27 #Javascript
You might like
php 删除无限级目录与文件代码共享
2008/11/22 PHP
CI框架学习笔记(二) -入口文件index.php
2014/10/27 PHP
php采集神器cURL使用方法详解
2016/02/19 PHP
浅谈PHP命令执行php文件需要注意的问题
2016/12/16 PHP
Yii 实现数据加密和解密
2021/03/09 PHP
JavaScript CSS 修改学习第四章 透明度设置
2010/02/19 Javascript
JavaScript去掉数组中的重复元素
2011/01/13 Javascript
23个Javascript弹出窗口特效整理
2011/02/25 Javascript
调试Javascript代码(浏览器F12及VS中debugger关键字)
2013/01/25 Javascript
Nodejs中 npm常用命令详解
2016/07/04 NodeJs
javascript ASCII和Hex互转的实现方法
2016/12/27 Javascript
JavaScript数据结构之数组的表示方法示例
2017/04/12 Javascript
Vue+Webpack完美整合富文本编辑器TinyMce的方法
2018/11/30 Javascript
微信小程序实现动态获取元素宽高的方法分析
2018/12/10 Javascript
解决vant title-active-color与title-inactive-color不生效问题
2020/11/03 Javascript
[03:55]DOTA2完美大师赛选手传记——LFY.MONET
2017/11/18 DOTA
pycharm 使用心得(五)断点调试
2014/06/06 Python
python实现计算资源图标crc值的方法
2014/10/05 Python
python Socket之客户端和服务端握手详解
2017/09/18 Python
Python set常用操作函数集锦
2017/11/15 Python
Python AES加密实例解析
2018/01/18 Python
Python实现基于C/S架构的聊天室功能详解
2018/07/07 Python
Python Matplotlib实现三维数据的散点图绘制
2019/03/19 Python
Python 中 -m 的典型用法、原理解析与发展演变
2019/11/11 Python
python with语句的原理与用法详解
2020/03/30 Python
详解Python中如何将数据存储为json格式的文件
2020/11/18 Python
StubHub德国:购买和出售门票
2017/09/06 全球购物
老板电器官方购物商城:老板油烟机、燃气灶、消毒柜、电烤箱
2018/05/30 全球购物
美国最受欢迎的度假目的地优惠套餐:BookVIP
2018/09/27 全球购物
JAVA中的关键字有什么特点
2014/03/07 面试题
自我鉴定书范文
2013/10/02 职场文书
怎么样写好简历中的自我评价
2013/10/25 职场文书
房地产融资计划书
2014/01/10 职场文书
欧也妮葛朗台读书笔记
2015/06/30 职场文书
2016年“5.12”护士节致辞
2015/07/31 职场文书
全家福照片寄语怎么写?
2019/04/02 职场文书