如何在Swift中创建分组条形图?

时间:2018-04-04 14:41:36

标签: ios swift charts

我正在使用Charts库在我的应用中显示图表。我在我的应用程序中有一个条形图,曾经在Swift 2.3和图表版本2.2.5中正常工作。但是,我最近将我的应用程序更新为Swift 4.1和Charts 3.1.0,但是在Charts库中进行更改会破坏我的应用程序中的功能。 如何正确迁移此代码块以使用新版本?

这是我正在使用的示例图表:

My Chart

这是创建此图表的JSON数据:

[{"Items":[{"X":"01.03.2018","Value":10000},{"X":"02.03.2018","Value":2500}],"Name":"Group 1"},{"Items":[{"X":"01.03.2018","Value":5000}],"Name":"Group 2"}]

这是我在Swift 2.3中使用的代码运行良好:

var xVals = [String]()
var datasets = [BarChartDataSet]()

    for i in 0..<json.count{

        var entries = [BarChartDataEntry]()

        for j in 0..<json[i]["Items"].count{

            if i == 0{
                xVals.append(json[i]["Items"][j]["X"].stringValue)
            }

            if json[i]["Items"][j]["Value"].doubleValue != 0.0{
                let entry = BarChartDataEntry(value: json[i]["Items"][j]["Value"].doubleValue, xIndex: j)

                entries.append(entry)
            }

        }

        let dataset = BarChartDataSet(yVals: entries, label: json[i]["Name"].stringValue)
        datasets.append(dataset)
    }

    let data = BarChartData(xVals: xVals, dataSets: datasets)
    barChart.data = data

这是迁移后的展示方式:

enter image description here

这有两个问题:

条形图堆叠而不是分组 xAxis确实显示索引而不是日期。

这是新的Swift 4.1代码:

var xVals = [String]()
var datasets = [BarChartDataSet]()

for i in 0..<json.count{

    var entries = [BarChartDataEntry]()

    for j in 0..<json[i]["Items"].count{

        if i == 0{
            xVals.append(json[i]["Items"][j]["X"].stringValue)
        }

        if json[i]["Items"][j]["Value"].doubleValue != 0.0{
            let entry = BarChartDataEntry(x: Double(j), y: json[i]["Items"][j]["Value"].doubleValue)

            entries.append(entry)
        }

    }

    let dataset = BarChartDataSet(values: entries, label: json[i]["Name"].stringValue)
    datasets.append(dataset)
}

let data = BarChartData(dataSets: datasets)
barChart.data = data

那么如何解决这两个问题?

1 个答案:

答案 0 :(得分:0)

[ Swift 4 ]您需要使用 groupBars valueFormatter 形成BarChart API。

这只是一个代码示例,您需要根据您的要求进行微调。

[修改1 ]

公式 :( 0.2 + 0.03)* countGourp + 0.08 = 1.00 - &gt;间隔每&#34;组&#34;

 let data = BarChartData(dataSets: datasets)
 // (0.2 + 0.03) * 2 + 0.54 = 1.00 
    let groupSpace = 0.54
    let barSpace = 0.03
    let barWidth = 0.2
    data.barWidth = barWidth

    barView.xAxis.axisMinimum = Double(0)
    barView.xAxis.axisMaximum = Double(0) + data.groupWidth(groupSpace: groupSpace, barSpace: barSpace) * Double(2)  // group count : 2
    data.groupBars(fromX: Double(0), groupSpace: groupSpace, barSpace: barSpace)

    barView.data = data

    let x_Axis = barView.xAxis
    x_Axis.valueFormatter = IndexAxisValueFormatter(values:xVals)
    x_Axis.centerAxisLabelsEnabled = true
    x_Axis.granularity = 1
    barView.xAxis.labelPosition = .top