Zooming Example with unit minutes

[Klaus HParticipant]

Hello,

I am trying to reproduce the zooming example with data unit minute.

I have tried using a timestamp format 2013-06-15 06:02 and Jun 15 2013 6:02AM, both which Date.parse (with extension from http://www.datejs.com/ ) can convert into a Date object (e.g. for minValue and maxValue).

But when I try to create the chart, the page stays empty and no error occurs.

   var settings = {
        title: "Exampletitle",
        description: "Exampledescription",
        enableAnimations: true,
        animationDuration: 1500,
        enableCrosshairs: true,
        padding: { left: 5, top: 5, right: 30, bottom: 5 },
        source: dataAdapter,
        categoryAxis:
            {
                dataField: 'dptimestamp',
                minValue: Date.parse($('#hdd_mints').val()),
                maxValue: Date.parse($('#hdd_maxts').val()),
                formatFunction: function (value) {
//                    return value.getDate() + '-' + months[value.getMonth()] + '\'' + value.getFullYear().toString().substring(2);
                	return value;
                },
                type: 'date',
                baseUnit: 'minute',
                rangeSelector: {
                    // Uncomment the line below to render the selector in a separate container 
                    //renderTo: $('#selectorContainer'),
                    size: 120,
                    padding: { /*left: 0, right: 0,*/top: 30, bottom: 0 },
                    minValue: Date.parse($('#hdd_mints').val()),
                    backgroundColor: 'white',
                    dataField: 'Close',
                    baseUnit: 'minute',
                    showGridLines: false,
                    formatFunction: function (value) {
                        return months[value.getMonth()] + '\'' + value.getFullYear().toString().substring(2);
                    }
                }
            },
        colorScheme: 'scheme01',
        seriesGroups:
            [
                {
                    type: 'line',
//                    toolTipFormatFunction: toolTipCustomFormatFn,
                    valueAxis:
                    {
                        description: 'Price per share [USD]<br><br>'
                    },
                    series: [
                        { dataField: 'dpvalue', displayText: 'Close Price', lineWidth: 1, lineWidthSelected: 1 }
                    ]
                }
            ]
    };
    $('#chartContainer').jqxChart(settings);

Is the baseUnit maybe the problem? Could you provide me with tip or an example if a base unit with minute is possible and how the data should look like?

Kind Regards
Klaus

[Peter StoevKeymaster]

Hi Klaus,

I suppose that if you set baseUnit to “minute” you should feed the Chart with Date objects, also the format functions should be implemented to display minutes and the minValue, maxValue, unitInterval are not necessary to be set at all.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Klaus HParticipant]

Hello Peter,

converting the data to Date objects did not solve the problem.

I have put up an example with 15 minutes of data in a fiddle: http://jsfiddle.net/LdaXg/1/

I still get no error, but nothing happens.

Best Regards
Klaus

[Peter StoevKeymaster]

Hi Klaus,

It would be good if you set the Chart’s width and height as well.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Klaus HParticipant]

Hello Peter,

thank you very much, that solved the mystery, I totally missed that when looking at the example.

Regards
Klaus

[Klaus HParticipant]

Additional question (I did not want to open a new topic for that):

Is it possibile or will it be possible in the future to use markers in the rangeselector like in jqxRangeSelector, so one can use this graph with zooming on a tablet?

Regards
Klaus

[Peter StoevKeymaster]

Hi Klaus,

In the future, the zooming capabilities would be improved. We will consider carefully these changes and I suppose that most of the customers will like them.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Klaus HParticipant]

Hello Peter,

great, thanks for the information.

Regards
Klaus

[Author]

Posts