代码:
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'
}
}
]
});