Stacked Horizontal Chart Scaling

[adeperio]

Hi there,

I am trying to draw a single horizontal stacked bar chart (its basically a regular stacked bar chart with a frameCenterRotation = -90 to make it horizontal) with linear data points. The yVal array I'm passing for x = 0 is:

[0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1]

So I am expecting the stacked bar chart to have equal length bars if the scale was linear. But when I draw them, it looks like this:

The following is the code I am using (self is a BarChartView):

`
//set data
let dataSet = BarChartDataSet(values: dataPoints, label: "Timeline")
dataSet.colors =[Theme.timeTrackingHorizontalTimeslotColour,Theme.timeTrackingHorizontalGapColour]
dataSet.valueFont = Theme.getChartFont()
dataSet.valueTextColor = Theme.appDefaultTextColour
dataSet.drawValuesEnabled = false

    //create the chart data object and add the data set
    let chartData = BarChartData(dataSet: dataSet)
    
    //then add chart data to the char view
    self.data = chartData
    self.drawGridBackgroundEnabled = false
    self.drawBordersEnabled = false
    self.dragEnabled = false
    self.chartDescription?.text = ""
    self.legend.enabled = false
    self.fitBars = true
    
    //vertical Y axis on the left
    self.leftAxis.drawGridLinesEnabled = false
    self.leftAxis.drawLabelsEnabled = false
    self.leftAxis.drawZeroLineEnabled = false
    self.leftAxis.drawTopYLabelEntryEnabled = false
    self.leftAxis.drawAxisLineEnabled = false
    self.leftAxis.drawGridLinesEnabled = false
    
    //vertical Y axis on the right
    self.rightAxis.drawAxisLineEnabled = false
    self.rightAxis.drawLabelsEnabled = false
    self.rightAxis.drawZeroLineEnabled = false
    self.rightAxis.drawGridLinesEnabled = false
    self.rightAxis.drawAxisLineEnabled = false
    self.rightAxis.zeroLineWidth = 0
    self.rightAxis.labelFont = Theme.getChartFont()
    self.rightAxis.labelTextColor = Theme.appDefaultTextColour
    
    
    //horizontal x axis lines
    self.xAxis.drawAxisLineEnabled = false
    self.xAxis.drawGridLinesEnabled = false
    self.xAxis.drawLabelsEnabled = false
    self.xAxis.drawAxisLineEnabled = false
    self.xAxis.labelFont = Theme.getChartFont()
    self.xAxis.labelTextColor = Theme.appDefaultTextColour
    
    self.animate(xAxisDuration: 1.0, yAxisDuration: 1.0)`

Is there anything here where I can get the bar sections to be equidistant / work on a linear scale?

Thanks

[liuxuan30]

ah.. it's a little too much to digest. We support horizontal stacked bar chart natively already.. What's your purpose for the rotation?

[adeperio]

I'm only rotating it because I thought thats how I would get a horizontal chart :)

But sounds like I am I setting this up incorrectly? Would you be able to point me to some examples that use a horizontal stacked chart?

[adeperio]

Ahh actually, think I just found some resources, looks like I use this?

HorizontalBarChart

[liuxuan30]

Just check out ChartsDemo, there are plenty of examples :) stacked bars are just a special case, so horizontal and vertical both support this.

[adeperio]

Hey @liuxuan30 Im still getting some weird graphing after using the HorizontalBarChart and following examples:

The following is the code I am using (where self is a HorizontalBarChartView):

`
let testChartValues : [Double] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
let dataPoints = [BarChartDataEntry(x: 0, yValues: testChartValues)]
let dataSet = BarChartDataSet(values: dataPoints, label: "Timeline")
dataSet.colors = [Theme.timeTrackingHorizontalTimeslotColour,Theme.timeTrackingHorizontalGapColour]
dataSet.valueFont = Theme.getChartFont()
dataSet.valueTextColor = Theme.appDefaultTextColour
dataSet.drawValuesEnabled = false

    //create the chart data object and add the data set
    let chartData = BarChartData(dataSet: dataSet)
    
    //then add chart data to the char view
    self.data = chartData
    self.drawGridBackgroundEnabled = false
    self.drawBordersEnabled = false
    self.dragEnabled = false
    self.chartDescription?.text = ""
    self.legend.enabled = false
    self.fitBars = true
    self.scaleXEnabled = false
    
    //horizontal x axis lines
    self.xAxis.drawAxisLineEnabled = false
    self.xAxis.drawGridLinesEnabled = false
    self.xAxis.drawLabelsEnabled = false
    self.xAxis.drawAxisLineEnabled = false

`

As you can see both the X scal is incorrect (it should be from 0-10 not in multiples of 10) and the coloured bars don't look like they are behaving in a linear way.

Any ideas where else I should be looking? Or if you needed more specific info maybe?

Thanks @liuxuan30

[adeperio]

Actually I've just realised I've been using it incorrectly! Those array values should be the values of the size of the sections in the stack. I've incorrectly assumed that they are the start and end points of each of the stack sections

[liuxuan30]

:) so problem solved? If so, please close this or I will close it

[adeperio]

Oh yep, this is solved (or wasn't even a problem at all ;) Thanks for your help