Ext-用散点图(chart)分析相关性

代码:

Ext.define('V5.auditoper.quekeyword.view.QuekeyScatter', {
    extend: 'Ext.chart.Chart',
    theme: 'Green',  //颜色主题
    animate : true,
    //图例
    legend: {
       position: 'right'
    },
    xtype: 'quekeyscatter',
    store: Ext.create('Ext.data.Store', {
            fields: ['temperature1','temperature2', 'date'],
            data: [
                    { temperature1: 38, temperature2: 38, date: 2},
                    { temperature1: 45, temperature2: 44, date: 5},
                    { temperature1: 58, temperature2: 48, date: 7},
                    { temperature1: 63, temperature2: 54, date: 10},
                    { temperature1: 57, temperature2: 60, date: 13},
                    { temperature1: 68, temperature2: 68, date: 17},
                    { temperature1: 41, temperature2: 74, date: 20}
                ]
            }),
     axes: [
        {
            title: 'A指标',
            type: 'Numeric',
            position: 'left',
            fields: ['temperature1','temperature2'],
            minimum: 0,
            maximum: 100
        },
        {
            title: 'B指标',
            type: 'Numeric',
            position: 'bottom',
            fields: ['date'],
            minimum: 0,
            maximum: 23
        }
    ],
    series: [
        {
            type: 'scatter',//图表类型(line:折线图,scatter:散点图,column:柱状图)
            xField: 'date',
            highlight: true,   //高亮
            yField: 'temperature1',
            markerConfig: {
                type: 'circle',
                size: 4,
                radius: 4,
                'stroke-width': 0
            },
            //悬浮提示
            tips: {
              trackMouse: true,
              width: 100,
              height: 28,
              renderer: function(storeItem, item) {
                this.setTitle('距离值:'+storeItem.get('date'));
              }
            },
            listeners : {
                itemclick : function(o) { 
                    alert(o.index);
                }
            }
        },
        {
            type: 'line',
            smooth: true,
            xField: 'date',
            yField: 'temperature2',
            markerConfig: {
                type: 'circle',
                size: 2,
                radius: 1,
                'stroke-width': 0,
                'fill': '#000'
            }
        }
    ]
});

效果如图:
Ext-用散点图(chart)分析相关性_第1张图片

你可能感兴趣的:(ExtJS)