首页 > Web开发 > 详细

extjs 改lineChart中线的颜色

时间:2015-02-02 19:56:42      阅读:971      评论:0      收藏:0      [点我收藏+]

var store = Ext.create(‘Ext.data.JsonStore‘, {

    fields: [‘name‘, ‘data1‘, ‘data2‘, ‘data3‘, ‘data4‘, ‘data5‘],

    data: [

        { ‘name‘: ‘metric one‘,   ‘data1‘: 10, ‘data2‘: 12, ‘data3‘: 14, ‘data4‘: 8,  ‘data5‘: 13 },

        { ‘name‘: ‘metric two‘,   ‘data1‘: 7,  ‘data2‘: 8,  ‘data3‘: 16, ‘data4‘: 10, ‘data5‘: 3  },

        { ‘name‘: ‘metric three‘, ‘data1‘: 5,  ‘data2‘: 2,  ‘data3‘: 14, ‘data4‘: 12, ‘data5‘: 7  },

        { ‘name‘: ‘metric four‘,  ‘data1‘: 2,  ‘data2‘: 14, ‘data3‘: 6,  ‘data4‘: 1,  ‘data5‘: 23 },

        { ‘name‘: ‘metric five‘,  ‘data1‘: 4,  ‘data2‘: 4,  ‘data3‘: 36, ‘data4‘: 13, ‘data5‘: 33 }

    ]

});


Ext.create(‘Ext.chart.Chart‘, {

    renderTo: Ext.getBody(),

    width: 500,

    height: 300,

    animate: true,

    store: store,

    axes: [

        {

            type: ‘Numeric‘,

            position: ‘left‘,

            fields: [‘data1‘, ‘data2‘],

            label: {

                renderer: Ext.util.Format.numberRenderer(‘0,0‘)

            },

            title: ‘Sample Values‘,

            grid: true,

            minimum: 0

        },

        {

            type: ‘Category‘,

            position: ‘bottom‘,

            fields: [‘name‘],

            title: ‘Sample Metrics‘

        }

    ],

    series: [

        {

            type: ‘line‘,

            highlight: {

                size: 7,

                radius: 7

            },

            axis: ‘left‘,

            xField: ‘name‘,

            yField: ‘data1‘,

            markerConfig: {

                type: ‘cross‘,

                size: 4,

                radius: 4,

                ‘stroke-width‘: 0

            },style: {      stroke: ‘#FFFF00‘,      fill: ‘#FFFF00‘ }

        },

        {

            type: ‘line‘,

            highlight: {

                size: 7,

                radius: 7

            },

            axis: ‘left‘,

  

            xField: ‘name‘,

            yField: ‘data2‘,

            style : {stroke : ‘#6600FF‘, fill : ‘#6600FF‘},

            markerConfig: {

                type: ‘circle‘,

                size: 4,

                radius: 4,

                ‘stroke-width‘: 0

            }

        }

    ]

});


extjs 改lineChart中线的颜色

原文:http://angelgirl.blog.51cto.com/1695763/1610863

(0)
(1)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!