jQuery UI Widgets Forums Chart When having a lot of data not all series text shows

Tagged: , , , ,

This topic contains 1 reply, has 2 voices, and was last updated by  Peter Stoev 7 years, 10 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author

  • collatz
    Member

    Hi,

    First I would like to say that I really enjoy using your products like charts and tree:).

    I have a problem when using a lot of data in a chart, I just have one chart on a page and it is used to display all days of a month with the number of auctions that day.

    When I view for example the month januari, the value axis shows the data, but the series axis where the days of this month are shown only shows the sequence: 1 4 7 10 13 16 19 22 25 28 31 instead of numbers 1 to 31. I would like to know if this a default setting wich can be overwritten or a bug?

    A copy of the JavaScript code i use:

            $(document).ready(function () {
                // prepare chart data
                var source = [
                    { day: '1', auctions: 4},
                    { day: '2', auctions: 8},
                    { day: '3', auctions: 10},
                    { day: '4', auctions: 1},
                    { day: '5', auctions: 4},
                    { day: '6', auctions: 4},
                    { day: '7', auctions: 1},
                    { day: '8', auctions: 6},
                    { day: '9', auctions: 9},
                    { day: '10', auctions: 0},
                    { day: '11', auctions: 0},
                    { day: '12', auctions: 2},
                    { day: '13', auctions: 2},
                    { day: '14', auctions: 4},
                    { day: '15', auctions: 4},
                    { day: '16', auctions: 2},
                    { day: '17', auctions: 1},
                    { day: '18', auctions: 2},
                    { day: '19', auctions: 1},
                    { day: '20', auctions: 6},
                    { day: '21', auctions: 8},
                    { day: '22', auctions: 8},
                    { day: '23', auctions: 5},
                    { day: '24', auctions: 4},
                    { day: '25', auctions: 4},
                    { day: '26', auctions: 1},
                    { day: '27', auctions: 2},
                    { day: '28', auctions: 2},
                    { day: '29', auctions: 3},
                    { day: '30', auctions: 3},
                    { day: '31', auctions: 1}
                ];
                var dataAdapter = new $.jqx.dataAdapter(source, { async: false, autoBind: true, loadError: function (xhr, status, error) { alert('Error loading "' + source.url + '" : ' + error);} });
    
                var settings = {
                    title: "Veilingen 2012(januari)",
                    description: "",
                    showLegend: true,
                    enableAnimations: true,
                    padding: { left: 5, top: 5, right: 5, bottom: 5 },
                    titlePadding: { left: 90, top: 0, right: 0, bottom: 10 },
                    source: dataAdapter,
                    categoryAxis:
                        {
                            dataField: 'day',
                            showGridLines: true
                        },
                    colorScheme: 'scheme01',
                    seriesGroups:
                        [
                            {
                                type: 'column',
                                columnsGapPercent: 50,
                                valueAxis:
                                {
                                    unitInterval: 1,
                                    displayValueAxis: true,
                                    description: 'Aantal veilingen'
                                },
                                series: [
                                        { dataField: 'auctions', displayText: 'Veilingen(per dag)', color:'#FF0000' }
                                    ]
                            },
                        ]
                };
                // setup the chart
                $('#jqxChart').jqxChart(settings);
            });
    

    Also added a screenshot:
    screenshot

    —edit—

    I am using:
    – Jquery 1.8.0
    – jQWidgets v2.4.2

    Thx in advance,

    Collatz

    • This topic was modified 7 years, 10 months ago by  collatz.

    Peter Stoev
    Keymaster

    Hi Collatz,

    You missed to set the unitInterval.

               categoryAxis:
    {
    dataField: 'day',
    showGridLines: true,
    unitInterval: 1
    },

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.