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

  写在前面,版本库: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纵坐标值重复问题的解决方法