ExtJs 막대 차트의 4 색 테마

이 차트를 그리기 위해 extJs 4를 사용하고 있습니다. http://dev.sencha.com/deploy/ext-4.0.7-gpl/examples/charts/BarRenderer.html. 그러나 각 막대에 대해 두 개 이상의 세그먼트가 있으며 여러 개의 막대가있을 수 있습니다. 나는 모든 바에 대해 완전히 다른 색깔을 갖고 싶다. 또한, 그 막대의 세그먼트에 대한 현재 막대 색상의 다른 음영을 원해. 동일한 색상 코드가 범례에 반영되어야합니다. 도움을 주시면 대단히 감사하겠습니다.ExtJs 막대 차트의 4 색 테마

출처

2012-03-13 dev

색을 지정하는 사용자 지정 차트 테마를 만들어야합니다. 한 번 꺾은 선 차트를 만들었습니다. barchart에서 작동하게하기 위해서는 약간의 수정이 필요할 수 있습니다. 그렇다면 % extjs-root %/src/chart/theme/Base.js에서 가능한 모든 옵션을 찾을 수 있습니다. 꺾은 선형 차트의 내용은 다음과 같습니다.

// CUSTOM CHART THEME 
Ext.chart.theme.myTheme = Ext.extend(Ext.chart.theme.Base, { 
    constructor: function(config) { 
     Ext.chart.theme.Base.prototype.constructor.call(this, Ext.apply({  
      colors: ['rgb(0, 0, 0)', 
        'rgb(0,0,255)', 
        'rgb(255,0,0)', 
        'rgb(0,128,0)', 
        'rgb(128,0,128)' 
      ],       
     }, config)); 
    } 
});

막대 차트 구성에 테마가 포함되어 있는지 확인하십시오.

xtype: 'chart', 
style: 'background:#fff', 
animate: true, 
store: myChartStore, 
theme: 'Events', 
legend: { 
    position: 'right' 
}, 
// other configs ...

출처

2012-03-13 17:01:19 Geronimo

해결책을 찾았습니다.

var colors = ['#ff0000','#FF9900','#009933',  '#888',    '#999']; 
var baseColor = '#eee'; 
Ext.define('Ext.chart.theme.Fancy', { 
    extend: 'Ext.chart.theme.Base', 
    constructor: function(config) { 
     this.callParent([Ext.apply({   
      colors: colors 
     }, config)]); 
    } 
});

을 그리고 당신이 만든 테마 전화 :

http://www.sencha.com/learn/drawing-and-charting/

가보기에이를 넣어

Ext.define('MyAPP.view.Graph.GrafPlazos',{ 
    extend: 'Ext.chart.Chart', 
    alias : 'widget.plazocibar', 
    id: 'chart_plazosci', 
    xtype: 'chart', 
    style: 'background:#fff', 
    animate: true, 
    shadow: true, 
    store: 'Plazos.GPlazosci', 
    theme: 'Fancy',

출처

2012-12-04 20:19:20

죄송합니다. 영어가 필요합니다. – KatieK

차트 유지 mixin로 테마를 사용을

그래서 직접 할 수 themeAttrs라는 테마 속성을 사용하십시오.

예를 들어

사용자가 지정할 수 있습니다, 열/누적 세로 막 대형 차트의 생성자에있는 컬럼의 색상을 변경하려면

this.themeAttrs.colors = [ '#의 F2C72B', '#의 a5c249', ' # E88712 ','# 9D5FFA '];

출처

2013-03-28 10:40:36 Sandesh

ExtJs 막대 차트의 4 색 테마

답변

관련 문제