Inconsistent scale values of chart

[vinodnParticipant]

Hi,

We have been reported an issue regarding scales of the chart where in the value of the first scale after zero is 13, then 25, then 38. So, the difference between the scales vary from 12 to 13. This instead should be consistent. Eg.: After 13, it should be 26, then 39, then 52 and so one, i.e. maintaining a constant difference of 13.

Please provide a solution for the same.
P.S.: We are using jqxChart along with AngularJS. Image and source code are below. Thanks in advance.

       $scope.Sector_data = p_ObjRootItem;
        $scope.Sector_title = "";
        $scope.Sector_description = "";
        $scope.Sector_enableAnimations = true;
        $scope.Sector_showLegend = false;
        $scope.Sector_toolTipShowDelay = 100;
        $scope.Sector_toolTipHideDelay = 2000;
        $scope.Sector_padding = { left: 0, top: 20, right: 100, bottom: 0 };
        $scope.Sector_legendLayout = { left: 865, top: 0, width: 300, height: 200, flow: 'vertical' };
        $scope.Sector_borderLineColor = '#f3f4f6';
        $scope.Sector_backgroundColor = '#f3f4f6';
        $scope.Sector_titlePadding = { left: 0, top: 0, right: 0, bottom: 10 };
        $scope.Sector_categoryAxis =
            {
                dataField: 'sector',
                displayText: 'Sector',
                textRotationAngle: 285,
                verticalDescriptionAlignment: 'left',
                showTickMarks: false,
                showGridLines: false,
                textOffset: { x: 0, y: 5 },
                formatFunction: function (value) {
                    var res = value;

                    if (res.length > 20) {
                        res = res.substring(0, 20) + "...";
                    }

                    return res;
                },
                toolTipFormatFunction: function (value) {
                    return value;
                }
            };
        $scope.Sector_colorScheme = 'myScheme';
        $scope.Sector_seriesGroups =
            [
                {
                    type: 'column',
                    useGradientColors: false,
                    columnsGapPercent: 50,
                    columnsMaxWidth: 50,
                    enableSeriesToggle: false,
                    valueAxis:
                        {
                            minValue: 0,
                            showTickMarks: false,
                            description: '%',
                            formatSettings: {
                                text: '',
                                decimalPlaces: 2
                            }
                        },
                    series: [
                       { dataField: 'total_perc', displayText: 'Total', showLabels: false, labelsVerticalAlignment: 'top', formatFunction: function (value) { if (isNaN(value)) { return value; } else { return value + '%'; } } }
                    ]
                }
            ];

[DimitarParticipant]

Hi vinodn,

The actual difference between the scales is the same (0.125), but the displayed values are rounded due to your decimalPlaces: 2 setting, i.e. 0.125 becomes 0.13 and 0.375 becomes 0.38. You can either increase the decimal places or set the valueAxis unitInterval to 0.13.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[Author]

Posts