The solution to the problem of repeating ExtJs ordinate values

  • 2020-03-30 02:08:20
  • OfStack

Version Library: Ext JS Library 3.3.1

When making a chart, many values of the vertical coordinate are the same, I accidentally found the following solution, it is ok to test yourself, write out for later check, so that others can see. Other versions have not been tested. Interested friends can test by themselves.
 
var chartStore;//The chart data
Ext.onReady(function(){ 

//Use the file from the current server, if you don't have this sentence, you will go to the adobe site by default
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" 
}] 
}); 

//Fetch data from the background
chartStore = new Ext.data.Store({ 
proxy : new Ext.data.HttpProxy({ 
url : 'loadColumnChart.do', 
method : 'POST' 
}), 
reader : json_reader 
}); 
chartStore.reload(); 

//Bar chart panel
var columnchartPanel = new Ext.Panel({ 
border :false, 
autoScroll : true, 
//Title: 'statistical chart of failure records of equipment measuring points ',
frame : true, 
renderTo : document.body, 
width: 800, 
height: 240, 
layout : 'fit', 
items : { 
xtype : 'columnchart', //  type  
store : chartStore, 
xField : 'pointName', //The X value
yField : 'faultCount', //Y values
yAxis : new Ext.chart.NumericAxis({ 
displayName : 'faultCount' 
//labelRenderer : Ext.util.Format.numberRenderer('0,0')// The key is this sentence, and I'll just comment it out and make it normal  
}), 
tipRenderer : function(chart, record) { 
return record.data.pointName + ' The failure frequency is: ' + 
Ext.util.Format.number(record.data.faultCount, '0,0'); 
}, 
series : [ {// column  
type : 'column', //The type can be changed to line
displayName : 'faultCount', 
yField : 'faultCount', 
style : { 
color : 0x99BBE8 
} 
}] 
} 
}); 

//Bar chart panel
var leftPanel = new Ext.Panel({ 
title: ' A histogram ', 
region:'west', 
margins: '5 0 0 0', 
cmargins: '5 5 0 0', 
width: 850, 
minSize: 700, 
maxSize: 850, 
autoScroll:true,//Set to true to generate a scrollbar when content overflows, which defaults to false
collapsible: true,//Allow contraction
items: columnchartPanel 
}); 

}); 

1. Before settlement:
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201402/201402271743143.gif? 2014127174340 ">  
2. After settlement:
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201402/201402271744144.gif? 2014127174430 ">  

Related articles: