Sencha 차트 원형 차트 회전

차트 1.1과 함께 Sencha Touch 2.1을 사용하여 일부 데이터를 표시하고 있습니다.Sencha 차트 원형 차트 회전

나는 파이 차트 아래에 그려져 있습니다

Pie chart example

나는 그들이 지금 어디에 머물 라벨을 원하지만, 나는 그들이 (회전하지 않음) 수평되고 싶어요.

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',

출처

2013-01-14 SnK

확실하지 않습니다 ... ['Label'] (http://docs.sencha.com/touch/2-1/#!/api/Ext.chart.label.Label) 않습니다. 'rotationRads' 설정 옵션을 가지고 있지만 기본값은 0입니다 (이것은''sprite.Text' (http://docs.sencha.com/touch/2-1/#!/api/Ext.draw .sprite.Text) 개체)이며 원형 차트가 회전 할 때 내부적으로 변경 될 가능성이 큽니다. 따라서 차트가 회전 할 때 레이블을 다시 회전 할 수 있습니다. 행운을 빌어 요. – jakerella

Display 속성이 [여기] 인 ExtJS 원형 차트에서 매우 간단합니다 (http://docs.sencha.com/ext-js/4-1/#!/api/Ext.chart.series.Pie -cfg-label). 나는 그것을 사용했다. Sencha Touch pie 시리즈에는 이와 같은 설정이 없으므로 소스 코드에서도 보지 못했습니다. sencha touch pie 시리즈의 레이블 생성 기능을 무시해야합니다. [여기 어딘가에] (http://docs.sencha.com/touch/2-1/source/Pie.html#Ext-chart-series-Pie), 지금은 해결할 시간이 없지만 일반적으로 나는 현상금으로 도약 할 것이다. 그것은 확실히 할 수 있습니다. – Geronimo

좋아, 나는 이것이 가장 좋은 방법인지 아닌지 확실하지 않다하지만 엽차 차트 라이브러리로 파고 약간의 시간을 보낸 이후,이 솔루션은 내가 기대했던 후 쉽게 그래서, 나를 위해 작동합니다.

그냥 앱 프로젝트의 touch/src/chart/series/sprite/PieSlice.js에있는 PieSlice.js에이 라인을 주석 :

labelCfg.rotationRads = midAngle + Math.atan2(surfaceMatrix.y(1, 0) - surfaceMatrix.y(0, 0), surfaceMatrix.x(1, 0) - surfaceMatrix.x(0, 0));

이 줄은 원형 차트의 레이블을 회전 할 수있는 핵심적인 역할로 수행합니다.

출처

2013-02-08 13:57:31 Eli

@SnK 이것은 프레임 워크 파일을 수정하는 대신 응용 프로그램에서 재정의로 가장 잘 작동합니다. [this] (http://docs.sencha.com/touch/2-1/#!/api/Ext.chart.series)의 placeLabel 함수에 대한 앱에 재정의 선언을 작성하면됩니다. sprite.PieSlice) 클래스를 사용합니다. – Geronimo

Sencha 차트 원형 차트 회전

답변

관련 문제