我使用 Sencha Touch 2.1 和 Charts 1.1 来显示一些数据。
我有一个饼图如下所示:
我希望标签保持现在的位置,但我希望它们是水平的(不旋转)。
extend: 'Ext.chart.PolarChart',
requires: [
'Ext.chart.axis.Numeric',
'Ext.chart.axis.Category',
'Ext.chart.series.Pie',
'Charting.store.charts.perStore',
'Ext.chart.interactions.Rotate'
],
config: {
colors: ["#6295C7", "#CCCCC", "#FFFFF"],
store: 'chrtProduct',
// centered:true,
// innerPadding:20,
series: [{
type: 'pie',
labelField: 'verdeling',
label:{
/*display:'middle',
orientation:'horizontal',*/
field:'patVerdeling',
font: '1em Trade Gothic LT Std Bold',
contrast:true,
disableCallout:true
},
xField: 'patVerdeling'
//,rotation:90
}]
//,interactions: ['rotate']
以下代码在取消注释时似乎没有任何作用。
display:'middle',
orientation:'horizontal',
最佳答案
好的,我不确定这是否是最好的方法,但它对我有用,所以在花了一些时间深入研究 sencha 图表库之后,解决方案比我预期的要容易。
只需在 PieSlice.js
中评论这一行位于 touch/src/chart/series/sprite/PieSlice.js
您的应用项目:
labelCfg.rotationRads = midAngle + Math.atan2(surfaceMatrix.y(1, 0) - surfaceMatrix.y(0, 0), surfaceMatrix.x(1, 0) - surfaceMatrix.x(0, 0));
此行作为旋转饼图标签的关键角色。
关于extjs - Sencha Charts 饼图标签旋转,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14319241/