CODEWITHSUNDEEP
highcharts
user2670996
user2670996

Reputation: 2674

Highchart categories issues

I have a highchart bar graph due to the big number of categories. Categories come in Unicode from json, but it is represented ok.

Some data is not represented ok. My code:

$(function () {
var categories = ["ANALOGO","ANALOGO KLORNER","A\u00d1ADIR 1\u00aa PIEZA","A\u00d1ADIR RESTO PIEZAS","ARANDELA DE ORO","ARANDELA ZOCALO","CAJITA","CALCINABLE","CALCINABLE DIAMETRO 4","CALCINABLE KLORNER","CARILLA EMPRES","COMPLETA DEFINITIVA","COMPLETA PROVISIONAL","COMPOSTURA","COMPOSTURA PROTESIS","COMPOSTURA SIMPLE","CORONA CIRCONIO","CORONA CIRCONIO SOBRE IMPLANTE","CORONA EMPRESS SIN METAL","CORONA JACKET CERAMICA","CORONA METAL CERAMICA","CORONA PROVISIONAL CEMENTADA","CORONA SOBRE IMPLANTE","CUBETA DE RESINA","ESQUELETICO BILATERAL 1-3 PZAS","ESQUELETICO BILATERAL 3-5 PZAS","ESQUELETICO BILATERAL 5-8 PZAS","ESQUELETICO BILATERAL 8-14 PZAS","ESQUELETICO UNILATERAL 1-3 PZAS","FERULA DE BLANQUEAMIENTO","FERULA DESCARGA","GANCHO UNIDAD","IMPLANTE PROVISIONAL ATORNILLADO","MERYLAND PIEZA","PARCIAL ACRILICO 10 PZAS O M\u00c1S","PARCIAL ACRILICO DE 1-3 PZAS","PARCIAL ACRILICO DE 4 PZAS","PARCIAL ACRILICO DE 5 PZAS","PARCIAL ACRILICO DE 6 PZAS","PARCIAL ACRILICO DE 7 PZAS","PARCIAL ACRILICO DE 8 PZAS","PARCIAL ACRILICO DE 9 PZAS","PARCIAL ACRILICO PROV. 10 PZAS O M\u00c1S","PARCIAL ACRILICO PROV. DE 1-3 PZAS","PARCIAL ACRILICO PROV. DE 4 PZAS","PARCIAL ACRILICO PROV. DE 5 PZAS","PARCIAL ACRILICO PROV. DE 6 PZAS","PARCIAL ACRILICO PROV. DE 7 PZAS","PERNO MU\u00d1ON COLADO","PERNO MU\u00d1ON DOBLE COLADO","PILAR ANGULADO","PROTESIS HIBRIDA","REBASE PROTESIS","REPARACION ARCADA CERAMICA","REPARACION CERAMICA","REPLICA DIAMETRO 5 MM","SOBREDENTADURA CON LOCATOR","SOLDADURA","TORNILLO AVINENT","TORNILLO KLORNER","TORNILLO TITANIO","VARIOS"];
    $('#container').highcharts({
        chart: {
            type: 'bar'
        },
        title: {
            text: 'Stacked bar chart'
        },
        xAxis: {
            categories: categories
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Total fruit consumption'
            }
        },
        legend: {
            backgroundColor: '#FFFFFF',
            reversed: true
        },
        plotOptions: {
            series: {
                stacking: 'normal'
            }
        },
            series: [

                    {   
                        name:'DENTALZUERA',
                        data: [
                            [categories.indexOf("COMPLETA PROVISIONAL"),4],[categories.indexOf("CORONA METAL CERAMICA"),1],
                            [categories.indexOf("CORONA SOBRE IMPLANTE"),2],[categories.indexOf("FERULA DESCARGA"),1],
                            [categories.indexOf("VARIOS"),1]
                        ]
                    },
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    ]
    });
});

The problem here is that last category here is 62 (I guess is the index), instead of category number: "VARIOS". I guess it is a bug because it happens with highcharts v.3.0.4. but did not happen with v.3.0.2

See fiddle:

http://jsfiddle.net/Ra6Mc/38/

The worst problem is with some data series, that not all the "needed" category labels are represented: I don't really know which criteria it choose or where my error is.

http://jsfiddle.net/Ra6Mc/37/

New data: series: [

                    {   
                        name:'DENTOTAL SALUD ORAL',
                        data: [
                            [categories.indexOf("COMPLETA PROVISIONAL"),4],[categories.indexOf("CUBETA DE RESINA"),2],
                            [categories.indexOf("PROTESIS HIBRIDA"),1],[categories.indexOf("VARIOS"),2]
                        ]
                    }
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    ]

Upvotes: 0

Views: 149

Answers (1)

Paweł Fus
Paweł Fus

Reputation: 45079

Yes, it looks like a bug, reported here. Thanks!

Simple workaround is to use tickPositioner and set pointRange: 1 for series: 

        tickPositioner: function (min, max) {
            var t = [],
                interval = 1;
            while (min <= max) {
                t.push(min);
                min += interval;
            }
            t.push(max)
            return t;
        }

jsFiddle

Upvotes: 1

Related Questions