Sencha Touch chart 时间轴
JSon 时间数据格式
{"data":[{"name":"00:05","sf":"1"},{"name":"00:15","sf":"1"},{"name":"00:25","sf":"1"},{"name":"00:35","sf":"1"},{"name":"00:45","sf":"1"},{"name":"00:55","sf":"1"},{"name":"01:05","sf":"1"},{"name":"01:15","sf":"1"},{"name":"01:25","sf":"1"},{"name":"01:35","sf":"1"},{"name":"01:45","sf":"1"},{"name":"01:55","sf":"1"},{"name":"02:05","sf":"1"},{"name":"02:15","sf":"1"},{"name":"02:25","sf":"1"},{"name":"02:35","sf":"1"},{"name":"02:45","sf":"1"},{"name":"02:55","sf":"1"},{"name":"03:05","sf":"1"},{"name":"03:15","sf":"1"},{"name":"03:25","sf":"1"},{"name":"03:35","sf":"1"},{"name":"03:45","sf":"1"},{"name":"03:55","sf":"1"},{"name":"04:05","sf":"1"},{"name":"04:15","sf":"1"},{"name":"04:25","sf":"1"},{"name":"04:35","sf":"1"},{"name":"04:45","sf":"1"},{"name":"04:55","sf":"1"},{"name":"05:05","sf":"1"},{"name":"05:15","sf":"1"},{"name":"05:25","sf":"1"},{"name":"05:35","sf":"1"},{"name":"05:45","sf":"1"},{"name":"05:55","sf":"1"},{"name":"06:05","sf":"1"},{"name":"06:15","sf":"1"},{"name":"06:25","sf":"1"},{"name":"06:35","sf":"1"},{"name":"06:45","sf":"1"},{"name":"06:55","sf":"1"},{"name":"07:05","sf":"1"},{"name":"07:15","sf":"1"},{"name":"07:25","sf":"1"},{"name":"07:35","sf":"1"},{"name":"07:45","sf":"1"},{"name":"07:55","sf":"1"},{"name":"08:05","sf":"1"},{"name":"08:15","sf":"1"},{"name":"08:25","sf":"1"},{"name":"08:35","sf":"1"},{"name":"08:45","sf":"1"},{"name":"08:55","sf":"1"},{"name":"09:05","sf":"1"},{"name":"09:15","sf":"1"},{"name":"09:25","sf":"1"},{"name":"09:35","sf":"1"},{"name":"09:45","sf":"1"},{"name":"09:55","sf":"1"},{"name":"10:05","sf":"1"},{"name":"10:15","sf":"1"},{"name":"10:25","sf":"1"},{"name":"10:35","sf":"1"},{"name":"10:45","sf":"1"},{"name":"10:55","sf":"1"},{"name":"11:05","sf":"1"},{"name":"11:15","sf":"1"},{"name":"11:25","sf":"1"},{"name":"11:35","sf":"1"},{"name":"11:45","sf":"1"},{"name":"11:55","sf":"1"},{"name":"12:05","sf":"1"},{"name":"12:15","sf":"1"},{"name":"12:25","sf":"1"},{"name":"12:35","sf":"1"},{"name":"12:45","sf":"1"},{"name":"12:55","sf":"1"},{"name":"13:05","sf":"1"},{"name":"13:15","sf":"1"},{"name":"13:25","sf":"1"},{"name":"13:35","sf":"1"},{"name":"13:45","sf":"1"},{"name":"13:55","sf":"1"},{"name":"14:05","sf":"1"},{"name":"14:15","sf":"1"},{"name":"14:25","sf":"1"},{"name":"14:35","sf":"1"},{"name":"14:45","sf":"1"},{"name":"14:55","sf":"1"},{"name":"15:05","sf":"1"},{"name":"15:15","sf":"1"},{"name":"15:25","sf":"1"},{"name":"15:35","sf":"1"},{"name":"15:45","sf":"1"},{"name":"15:55","sf":"1"},{"name":"16:05","sf":"1"},{"name":"16:15","sf":"1"},{"name":"16:25","sf":"1"},{"name":"16:35","sf":"1"},{"name":"16:45","sf":"1"},{"name":"16:55","sf":"1"},{"name":"17:05","sf":"1"},{"name":"17:15","sf":"1"},{"name":"17:25","sf":"1"}]}
var store = Ext.create("Ext.data.Store", {
fields:[{name:'name',type:'date',dateFormat:'G:i'},{name:'sf',type:'int'}],
data:result.isSucc.data //这是上面的Json
});
{
xtype:'container',
layout:'fit',
items:[{ xtype: 'chart', store:store,
interactions: [
{
type: 'panzoom',
axes: {
"left": {
allowPan: false,
allowZoom: false
},
"bottom": {
allowPan: true,
allowZoom: true
}
}
}
],
series: [
{
type: 'line',
xField: 'name',
yField: 'sf',
style: {
stroke: 'rgb(183,218,90)',
lineWidth: 2
},
// title: 'Circle',
highlightCfg: {
scale: 0.7
},
marker: {
type: 'image',
src: 'glyphicons_095_vector_path_circle.png',
width: 46,
height: 46,
x: -23,
y: -23,
scale: 0.5,
fx: {
duration: 200
}
}
}],
axes: [
{
type: 'numeric',
position: 'left',
fields: ['sf'],
minimum: -2,
maximum: 2,
},
{
type: 'time',
dateFormat: 'G:i', //
fields: ['name'],
position: 'bottom',
visibleRange: [0, 0.25],
}
]
}]
}