Question

我是Scencha的新手。我正在使用Scencha图表的条形图示例。我无法更改图表的颜色，默认情况下是。我在哪里可以更改以下代码中的颜色？我怎样才能转换条形图，它是从左到右？

var barChart = new Ext.chart.Panel({
    title: 'Bar Chart',
    layout: 'fit',
    iconCls: 'bar',
    dockedItems: {
        iconCls: 'shuffle',
        iconMask: true,
        ui: 'plain',
        handler: onRefreshTap1
    },
    items: [{
        xtype: 'chart',
        cls: 'barcombo1',
        theme: 'Demo',
        store: store1,
        animate: true,
        shadow: false,
        legend: {
            position: {
                portrait: 'right',
                landscape: 'top'
            }
        },
        interactions: [
        'reset',
        'togglestacked',
        {
            type: 'panzoom',
            axes: {
                left: {}
            }
        },
        {
            type: 'iteminfo',
            gesture: 'taphold',
            panel: {
                dockedItems: [{
                    dock: 'top',
                    xtype: 'toolbar',
                    title: 'Details'
                }],

                html: 'Testing'
            },
            listeners: {
                'show': function(me, item, panel) {
                    var storeItem = item.storeItem;
                  //  panel.update('<ul><li><b>Month:</b> ' + storeItem.get('name') + '</li><li><b>Value: </b> ' + storeItem.get('2008') + '</li></ul>');
                }
            }
        },
        {
            type: 'itemcompare',
            offset: {
                x: -10
            },
            listeners: {
                'show': function(interaction) {
                    var val1 = interaction.item1.value,
                        val2 = interaction.item2.value;

                    barChart.descriptionPanel.setTitle('Trend from ' + val1[0] + ' to ' + val2[0] + ' : ' + Math.round((val2[1] - val1[1]) / val1[1] * 100) + '%');
                    barChart.headerPanel.setActiveItem(1, {
                        type: 'slide',
                        direction: 'left'
                    });
                },
                'hide': function() {
                    barChart.headerPanel.setActiveItem(0, {
                        type: 'slide',
                        direction: 'right'
                    });
                }
            }
        }],
        axes: [{
            type: 'Numeric',
            position: 'bottom',
            fields: ['TY', 'LY'],
            label: {
                renderer: function(v) {
                    return v.toFixed(0);
                }
            },
            title: 'Hits (Billions)',
            minimum: 0
        },
        {
            type: 'Category',
            position: 'left',
            fields: ['name'],
            title: 'Weeks'
        }],
        series: [{
            type: 'bar',
            label: {
               Field:'TY'
            },
            xField: 'name',
            yField: ['TY', 'LY'],
            axis: 'bottom',
            highlight: true,
            showInLegend: true

        }]
    }]
});

Answer 1

在以下代码段中将类型'bar'更改为'column'：

series: [{
            type: 'bar',
            label: {
               Field:'TY'
            },

如何改变情景条形图的颜色？

1 个答案: