어레이에서 여러 데이터를 가져올 때 iOS 차트를 사용하는 방법은 무엇입니까?

Question

지난 며칠 동안 iOS 차트를 사용하는 법을 배우고 API에서 호출 된 '단일'데이터를 다룰 때 성공적으로 작업했습니다.

그러나 배열에서 여러 데이터를 가져 오려면 여기에 멈추었습니다.

내 목표는 아래의 배열의 각 user_name의 winning_streak 기반으로하는 막 대형 차트를 만드는 것입니다 :

이 내가 필요로하는 곳에이다 :

["leagueStats": { 
winningStreak =  (
      { 
     id = 2; 
     "user_name" = Dicky; 
     "winning_streak" = 5; 
    }, 
      { 
     id = 6; 
     "user_name" = G; 
     "winning_streak" = 2; 
    }, 
      { 
     id = 5; 
     "user_name" = Sultan; 
     "winning_streak" = 0; 
    } 
); 
} 
] 

이것은 API를 검색 내 코드입니다 도움 - 어떤 종류의 루프를 만들어야합니까? 제공된 답변에서 그래프에 표시 할 사용자의 수는 미리 프로그래밍되어 있습니다.

아래의 현재 코드는 배열의 첫 번째 객체 만 선택합니다. 배열을 순환하고 원하는 변수를 채우려면 어떻게해야합니까?

if let dict = json?["leagueStats"] as? [String:AnyObject] { 

         // WINNING STREAK 

         if let dataWinStreak = dict["winningStreak"] as? [[String : AnyObject]] { 
          let newdictWinStreak = dataWinStreak.first! // I'm guess this needs to be removed and this section re-structured? 

          let tempWinStreakNumber = newdictWinStreak ["winning_streak"] as? String 
          let tempWinStreakNewNumber = Int(tempWinStreakNumber!) 
          let doubleWinStreak = Double(tempWinStreakNewNumber!) 

          self.winStreak = doubleWinStreak 
          self.winningStreak = ["Wins"] 

          let games = [self.winStreak] 
          self.setWinStreakChart(dataPoints: self.winningStreak, values: games) 

         } 

그러나 상기 코드 만 5 사용하는 배열의 첫 번째 기록 정보로 당긴다.

난 5, 2 및 0의 대응하는 값을, (3) 다른 열 Dicky, G, Sultan를 생성 할 수 있도록하려는.

막대 그래프를 표시하는 코드입니다. 현재는 1 열만 표시하고 있습니다 (5).

func setWinStreakChart(dataPoints: [String], values: [Double]){ 

    let formato:WinningStreakFormatter = WinningStreakFormatter() 
    let xaxis:XAxis = XAxis() 

    winningStreakBarChart.noDataText = "you need to provide some data for the chart." 

    var dataEntries: [BarChartDataEntry] = Array() 

    for i in 0..<dataPoints.count { 
     let dataEntry = BarChartDataEntry(x: Double(i), y: values[i]) 
     dataEntries.append(dataEntry) 
     formato.stringForValue (Double(i), axis: xaxis) 
    } 

    xaxis.valueFormatter = formato 
    winningStreakBarChart.xAxis.valueFormatter = xaxis.valueFormatter 

    let chartDataSet = BarChartDataSet(values: dataEntries, label: "Games Played") 
    let chartData = BarChartData(dataSets: [chartDataSet]) 

    chartData.addDataSet(chartDataSet) 
    winningStreakBarChart.data = chartData 

    winningStreakBarChart.xAxis.granularityEnabled = true 
    winningStreakBarChart.xAxis.granularity = 1.0 

    self.winningStreakBarChart.xAxis.labelPosition = XAxis.LabelPosition.bottom 

} 

이 내가 가진 것입니다 :

이

이상적으로, 내가 원하는 것은 그 전설 Games _Played이 Winning Streak 말을 할 수있는 API에서 user_name, 될 수있는 라벨 '연승'입니다. 이 특별한 경우에는 배열에있는 3 개의 user_names에 대해 3 개의 열을 원합니다.

이 작업이 완료되면 보조 목표로 동일한 user_name으로 그룹화되는 Losing Streak에 대한 다른 데이터 세트를 추가하고 싶습니다.

누군가이 방법을 보여줄 수 있습니까? 감사합니다

Answer 1

WinningStreakFormatter xAxis 레이블을 서식 지정하는 데 클래스가 사용됩니다. 여기서 차트 개체의 데이터를 다시 사용하여 차트보기에 약한 참조가 나타납니다. WinningStreakFormatter 그래서 우리는 데이터를 수있는이 방법을 사용하는 것은 오히려 아래 코드 chartView에서 제안 된 차트를 준비하기 위해 아래의 코드를 참조하십시오 WinningStreakFormatter

import Foundation 
import Charts 

class WinningStreakFormatter: NSObject, IAxisValueFormatter { 

    weak var _chartView : BarChartView! 

    init(chartView : BarChartView) { 
     self._chartView = chartView 
    } 

    public func stringForValue(_ value: Double, axis: AxisBase?) -> String { 
     let barChartData : IChartDataSet = (self._chartView.barData?.dataSets.first)! 
     let barChartDataEntry : ChartDataEntry = barChartData.entryForIndex(Int(value))! 
     return barChartDataEntry.data as! String 
    } 
} 

로 추가 복사본을 유지하는 것보다 차트보기로 개최 기본적으로 BarChartView 유형 인스턴스 변수. 또한 API에서 사용하는 데이터 구조와 동일한 데이터 구조를 사용 했으므로 간단히 dataPoints를 파싱 된 데이터 구조로 바꿀 수 있습니다.

self.chartView.drawBarShadowEnabled = false 
    self.chartView.drawValueAboveBarEnabled = true 
    self.chartView.chartDescription?.enabled = false 

    let xAxis : XAxis = self.chartView.xAxis; 
    xAxis.labelFont = UIFont(name: "HelveticaNeue-Light", size: 10.0)! 
    xAxis.labelTextColor = UIColor.black 
    xAxis.drawAxisLineEnabled = false 
    xAxis.drawGridLinesEnabled = true 
    xAxis.granularity = 1; 
    xAxis.labelPosition = .bottom 
    xAxis.valueFormatter = WinningStreakFormatter(chartView: self.chartView) 

    let yAxisLeft : YAxis = self.chartView.leftAxis 
    yAxisLeft.axisMinimum = 0.0 

    let yAxisRight : YAxis = self.chartView.rightAxis 
    yAxisRight.axisMinimum = 0.0 

    let l : Legend = self.chartView.legend; 
    l.horizontalAlignment = Legend.HorizontalAlignment.left 
    l.verticalAlignment = Legend.VerticalAlignment.bottom 
    l.orientation = Legend.Orientation.horizontal 
    l.drawInside = false 
    l.form = Legend.Form.square 
    l.formSize = 9.0 
    l.font = UIFont(name: "HelveticaNeue-Light", size: 11.0)! 
    l.xEntrySpace = 4.0 

    //Data Structure built for each user for winning streak, you can use your parsing logic to prepare the same 
    let winningStreakDM1 : [String : Any] = [ 
     "id" : 2, 
     "user_name" : "Dicky", 
     "winning_streak" : 5 
    ] 

    let winningStreakDM2 : [String : Any] = [ 
     "id" : 6, 
     "user_name" : "G", 
     "winning_streak" : 2 
    ] 

    let winningStreakDM3 : [String : Any] = [ 
     "id" : 5, 
     "user_name" : "Sultan", 
     "winning_streak" : 0 
    ] 


    //Array of the each user winning streak dictionary. 
    let dataPoints = [winningStreakDM1, winningStreakDM2, winningStreakDM3] 

    var values = [BarChartDataEntry]() 

    for i in 0..<dataPoints.count { 
     let xValue = Double(i) 
     let yValue = Double(dataPoints[i]["winning_streak"] as! Int) 

     let barChartDataEntry = BarChartDataEntry(x: xValue, y: yValue, data: dataPoints[i]["user_name"] as AnyObject) 
     values.append(barChartDataEntry) 
    } 

    let barChartDataSet = BarChartDataSet(values: values, label: "Winning Streak") 
    barChartDataSet.colors = ChartColorTemplates.material() 

    let barChartData = BarChartData(dataSet: barChartDataSet) 
    barChartData.setValueFont(UIFont.systemFont(ofSize: 12.0)) 
    self.chartView.data = barChartData