Ext.chart.axis.Time auto min/max issue

[watermark]

Ext version tested:

• Ext 4.0.7

Browser versions tested against:

• Chrome 17
• Firefox 10

DOCTYPE tested against:

• XHTML 1.0 Transitional

Description:

• Data points will not match up with x-axis labels

Steps to reproduce the problem:

• Render the below chart

The result that was expected:

• The store values to be somewhat close to the x-axis labels

The result that occurs instead:

• The x-axis labels are often nowhere close to the actual store values

Test Case:

Ext.define('App.store.Vital', {
    extend: 'Ext.data.ArrayStore',
    
    data: [[1,'2012-03-12 15:20:00','2012-03-12','15:20:00',60,60,60,60],[2,'2012-03-12 15:25:00','2012-03-12','15:20:00',60,60,60,60],[3,'2012-03-12 15:30:00','2012-03-12','15:20:00',60,60,60,60]],
    
    fields: [{
            name: 'Vital-id',
            type:'int'
        },{
            name: 'Vital-datetime',
            type: 'date',
            dateFormat: 'c'
        },{
            name: 'Vital-date',
            type: 'date',
            dateFormat: 'c'
        },{
            name: 'Vital-time',
            type: 'date',
            dateFormat: 'H:i:s'
        },{
            name: 'Vital-systolic',
            type:'int'
        },{
            name: 'Vital-diastolic',
            type:'int'
        },{
            name: 'Vital-hr',
            type:'int'
        },{
            name: 'Vital-spo2',
            type:'int'
        }
    ],
    
    sorters: [{
            property: 'Vital-datetime',
            direction: 'ASC'
        }
    ]
    
});

Ext.create('Ext.chart.Chart', {
            title: 'Chart',
            store: Ext.create('App.store.Vital'),
            theme: 'Category1',
            height: 400,
            width: 650,
            animate: false,
            legend: {
                position: 'right',
                padding: 10
            },
            axes: [{
                    type: 'Numeric',
                    position: 'left',
                    title: 'Value',
                    grid: true,
                    fields: ['Vital-systolic', 'Vital-diastolic', 'Vital-hr', 'Vital-spo2'],
                    minorTickSteps: 1,
                    minimum: 0,
                    maximum: 200
                },{
                    type: 'Time',
                    position: 'bottom',
                    fields: 'Vital-datetime',
                    title: 'Time',
                    dateFormat: 'm/d H:i'
                }
            ],
            series: [{
                    type: 'scatter',
                    axis: 'left',
                    xField: 'Vital-datetime',
                    yField: 'Vital-systolic',
                    title: 'Systolic',
                    markerConfig: {
                        type: 'triangle',
                        fill: 'orange'
                    }
                },{
                    type: 'scatter',
                    axis: 'left',
                    xField: 'Vital-datetime',
                    yField: 'Vital-diastolic',
                    title: 'Diastolic',
                    markerConfig: {
                        type: 'triangle',
                        fill: 'green'
                    }
                },{
                    type: 'scatter',
                    axis: 'left',
                    xField: 'Vital-datetime',
                    yField: 'Vital-hr',
                    title: 'HR',
                    markerConfig: {
                        type: 'circle',
                        fill: 'red'
                    }
                },{
                    type: 'scatter',
                    axis: 'left',
                    xField: 'Vital-datetime',
                    yField: 'Vital-spo2',
                    title: 'Sp02',
                    markerConfig: {
                        type: 'circle',
                        fill: 'blue'
                    }
                }
            ]
        });

Screenshot or Video:

• attached

Possible fix:

• not provided

Additional CSS used:

• default ext-all-grey.css
• some custom CSS that shouldn't affect Ext

Operating System:

• Windows 7 Pro
• Ubuntu 11.04

[mitchellsimoens]

Thanks for the report.