Как реализовать диаграмму iOS в ячейке таблицы?

Я использую диаграммы iOS (https://github.com/danielgindi/ios-charts) и он отлично работает в обычном контроллере представления. Однако я хочу реализовать эти диаграммы в ячейке таблицы, где источник данных будет отличаться в зависимости от ячейки. Кроме того, выход к представлению, отображающему эту диаграмму, находится в моем подклассе ячеек. Как мне реализовать этот код (где он работает в неповторяющемся контроллере представления) для отображения в представлении в моем подклассе ячеек? Заранее спасибо!!

class ChartViewController: UIViewController {

   @IBOutlet weak var lineChartView: LineChartView!

      override func viewDidLoad() {
         super.viewDidLoad()

         let candidates = ["Jan", "Feb", "Mar", "Apr", "May", "Jun"]
         let ratings = [33.0, 20.0, 13.0, 9.0, 8.0, 6.0]

         setChart(candidates, values: ratings)
      }

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

         var dataEntries: [ChartDataEntry] = []

         for i in 0..<dataPoints.count {

            let dataEntry = ChartDataEntry(value: values[i], xIndex: i)

            dataEntries.append(dataEntry)
         }

         let lineChartDataSet = LineChartDataSet(yVals: dataEntries, label: "Rating")
         let lineChartData = LineChartData(xVals: dataPoints, dataSet: lineChartDataSet)
         lineChartView.data = lineChartData
         lineChartView.animate(xAxisDuration: 2.0)
      } 
}

person tahoecoop    schedule 03.11.2015    source источник
comment
Для будущих зрителей. Вы, ребята, можете взглянуть на это: github. com/29satnam/Charts-LineChart   -  person Codetard    schedule 24.05.2018


Ответы (2)


Вы можете настроить представление ячейки для своего подкласса ячейки представления таблицы, чтобы вы могли использовать LineChartView в раскадровке, скопировав все из вашего контроллера представления в ячейку представления прототипа таблицы.

Не забудьте установить класс вашей пользовательской ячейки в инспекторе удостоверений раскадровки.

Добавьте некоторые свойства для хранения параметров диаграммы. Их можно установить, когда вы вызываете ячейку в cellForRowAtIndexPath:.

Например:

class MyTableViewCell: UITableViewCell {
    @IBOutlet weak var lineChartView: LineChartView!
    var candidates: Array<String>?
    var ratings: Array<Float>?

Когда вы вызываете ячейку, свойства могут быть установлены:

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {        
    let cell = tableView.dequeueReusableCellWithIdentifier(“chartCell”, forIndexPath: indexPath)
    candidates = someCandidatesArrayForIndexPath(indexPath)
    ratings = someRatingsArrayForIndexPath(indexPath)
    cell.setChart()
    return cell
}

Поэтому, когда вы вернете ячейку, у нее будут установлены свойства для отображения другого представления на основе ее индексного пути. Функции someCandidatesArrayForIndexPath() и someRatingsArrayForIndexPath(), которые я использовал в примере, получают значения, необходимые для отображения. Вам нужно будет написать эти функции.

person Daniel Zhang    schedule 03.11.2015
comment
@ lizzy81 lizzy81 вы сделали на диаграммах Objective-C, отображая на tableviewcell - person Joyal Clifford; 23.06.2016
comment
@JoyalClifford да, я заставил это работать. как я могу помочь? - person lizzy81; 28.06.2016
comment
@ lizzy81 lizzy81 не могли бы вы объяснить, как я могу добиться этого в obj c - person hacker; 15.08.2016
comment
Ответ @hacker добавлен ниже - person lizzy81; 21.09.2016

Цель-C


Подкласс UITableViewCell

@interface ChartTVCell : UITableViewCell <ChartViewDelegate>
@property (nonatomic, strong) IBOutlet CombinedChartView *chartView;
@end

Настройте свои диаграммы в tableView:cellForRowAtIndexPath:

divChartData является instanceVar CombinedChartData

else if (indexPath.section == 2) {
    ChartTVCell *cell = [tableView dequeueReusableCellWithIdentifier:@"chartCell" forIndexPath:indexPath];

    cell.chartView.data = divChartData; // <-- this is where your chart data is located. 
    cell.chartView.noDataText = divChartText;
    cell.chartView.tag = 101;

    cell.chartView.delegate = self;
    ...
    // blah blah blah, set up your charts
    ...
    cell.chartView.xAxis.spaceBetweenLabels = 2.0;

    return cell;
}

Получение данных

Я получаю свои данные из вызова веб-службы, varData - это NSMutableArray с моими данными


// Create the necessary arrays
NSMutableArray<BarChartDataEntry *> *cyValues = [NSMutableArray array], *lyValues = [NSMutableArray array];
NSMutableArray<NSString *> *dates = [NSMutableArray array];
NSMutableArray<UIColor *> *divColors = [NSMutableArray array];

// Loop through your data, populating your charts datasource, colors, ect...
for (int i = 0; i < varData.count; i++) {
    [dates addObject:[CR convertDate:[varData[i]HOUR] inputFormat:@"H" outputFormat:@"h a"]];
    [cyValues addObject:[[BarChartDataEntry alloc] initWithValue:[[varData[i]CYSALES] floatValue] xIndex:i]];
    [lyValues addObject:[[BarChartDataEntry alloc] initWithValue:[[varData[i]LYSALES] floatValue] xIndex:i]];
    [divColors addObject:[UIColor getColorForHourlyChartData:[[varData[i]CYSALES] floatValue] andValue2:[[varData[i]LYSALES] floatValue]]];
}

// init your charts dataSource with the values from above
divChartData = [[CombinedChartData alloc] initWithXVals:dates];
divChartData.barData = [self setupBarChartWithValues:lyValues withLabel:@"Last Year" withColor:[UIColor chartLY] withColorArray:nil];
divChartData.lineData = [self setupLineChartWithValues:cyValues withLabel:@"Current Year" withColor:[UIColor chartCY] withColorArray:divColors];

// Reload tableView
[self.tableView reloadData];

Примечание: я предпочитаю использовать диаграмму Combined из-за возможности перехода от строки к столбцу, от разброса к круговой диаграмме и обратно к строке без особых изменений (т.е. вы не можете добавить barChart к lineChartView).

person lizzy81    schedule 20.09.2016