Horizontal Column Graph Issue

[sushanth009Member]

Hello Peter,

I tried populating a column graph with Horizontal orientation , the chart is rendering properly but some of the text is missing for some reason.. Can you have a look at it..

var data = [
   {
      "a":"[2001] 100 W Chestnut St  2001, , Chicago, IL  60610",
      "c":"54.43"
   },
   {
      "a":"[2710] 100 W Chestnut St  2710, , Chicago, IL  60610",
      "c":"47.81"
   },
   {
      "a":"[1703] 100 W Chestnut St  1703, , Chicago, IL  60610",
      "c":"35.64"
   },
   {
      "a":"[0302] 100 W Chestnut St  302, , Chicago, IL  60610",
      "c":"35.22"
   },
   {
      "a":"[2910] 100 W Chestnut St  2910, , Chicago, IL  60610",
      "c":"32.13"
   },
   {
      "a":"[2103] 100 W Chestnut St  2103, , Chicago, IL  60610",
      "c":"31.80"
   },
   {
      "a":"[0307] 100 W Chestnut St  307, , Chicago, IL  60610",
      "c":"29.21"
   },
   {
      "a":"[0704] 100 W Chestnut St  704, , Chicago, IL  60610",
      "c":"25.87"
   },
   {
      "a":"[1902] 100 W Chestnut St  1902, , Chicago, IL  60610",
      "c":"19.92"
   },
   {
      "a":"[1803] 100 W Chestnut St  1803, , Chicago, IL  60610",
      "c":"19.71"
   },
   {
      "a":"[2908] 100 W Chestnut St  2908, , Chicago, IL  60610",
      "c":"16.50"
   },
   {
      "a":"[1106] 100 W Chestnut St  1106, , Chicago, IL  60610",
      "c":"15.67"
   },
   {
      "a":"[2207] 100 W Chestnut St  2207, , Chicago, IL  60610",
      "c":"15.63"
   },
   {
      "a":"[2201] 100 W Chestnut St  2201, , Chicago, IL  60610",
      "c":"15.20"
   },
   {
      "a":"[2204] 100 W Chestnut St  2204, , Chicago, IL  60610",
      "c":"14.30"
   },
   {
      "a":"[3010] 100 W Chestnut St  3010, , Chicago, IL  60610",
      "c":"13.65"
   },
   {
      "a":"[1402] 100 W Chestnut St  1402, , Chicago, IL  60610",
      "c":"13.33"
   },
   {
      "a":"[2706] 100 W Chestnut St  2706, , Chicago, IL  60610",
      "c":"13.03"
   },
   {
      "a":"[2807] 100 W Chestnut St  2807, , Chicago, IL  60610",
      "c":"10.18"
   },
   {
      "a":"[1806] 100 W Chestnut St  1806, , Chicago, IL  60610",
      "c":"8.05"
   },
   {
      "a":"[1602] 100 W Chestnut St  1602, , Chicago, IL  60610",
      "c":"7.24"
   },
   {
      "a":"[1102] 100 W Chestnut St  1102, , Chicago, IL  60610",
      "c":"6.55"
   },
   {
      "a":"[1207] 100 W Chestnut St  1207, , Chicago, IL  60610",
      "c":"4.10"
   },
   {
      "a":"[2010] 100 W Chestnut St  2010, , Chicago, IL  60610",
      "c":"2.30"
   }
]

This is the json data..

 var source = {
                datafields: [{ name: 'a' }, { name: 'c'}],
                localdata: data,
                datatype: 'json'
            };
            var dataAdapter = new $.jqx.dataAdapter(source);
            var settings = {
                title: "Service Locations",
                showLegend: true,
                source: dataAdapter,
                enableAnimations: true,
                padding: { left: 15, top: 5, right: 15, bottom: 5 },
                titlePadding: { left: 90, top: 0, right: 0, bottom: 10 },
                categoryAxis: {
                    dataField: 'a',
                    showGridLines: true,
                    text: 'Service Locations',
                    textRotationAngle: 90,
                    flip: false
                },
                colorScheme: 'scheme01',
                seriesGroups:
                [
                    {
                        type: 'column',
                        orientation: 'horizontal',
                        columnsGapPercent: 100,
                        toolTipFormatSettings: { thousandsSeparator: ',' },
                        valueAxis:
                            {
                                flip: true,
                                unitInterval: 10,
                                displayValueAxis: true,
                                minValue: minValue,
                                maxVaue: maxValue + 1,
                                description: comp
                            }
                    }
                ]
            };
$('#charts').jqxChart(settings);

Your help is really appreciated..

Thanks
Sushanth

[Peter StoevKeymaster]

Hi sushanth009,

Thank you for the feedback! Your feedback is greatly appreciated!

We will investigate the reported behavior.

Best Wishes,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts