用户与 ios-图表的交互

User interaction with ios-charts

我想在 ios-图表(折线图)和地图之间添加用户交互。当用户滑过图表时,我需要获取当前图表位置的索引或值,并将其用于函数中。在演示中没有找到任何东西...

class MotoChart: UIView {

    @IBOutlet weak var lineChartView: LineChartView!

    // 1 - creating an array of data entries
    var yVals1 : [ChartDataEntry] = [ChartDataEntry]()
    let months = ["Jan" , "Feb", "Mar", "Apr", "May", "June", "July", "August", "Sept", "Oct", "Nov", "Dec"]
    let dollars1 = [1453.0,2352,5431,1442,5451,6486,1173,5678,9234,1345,9411,2212]


    //MARK: overrides
    override func prepareForInterfaceBuilder() {
        super.prepareForInterfaceBuilder()
    }

    override func awakeFromNib() {
    }


    func setupChart(routeMaster: RouteMaster){

        self.lineChartView.descriptionText = "Speed"
        self.lineChartView.descriptionTextColor = UIColor.blackColor()
        self.lineChartView.gridBackgroundColor = UIColor.darkGrayColor()
        self.lineChartView.noDataText = "No data provided"
        self.lineChartView.rightAxis.enabled = false
        self.lineChartView.drawGridBackgroundEnabled = false
        self.lineChartView.doubleTapToZoomEnabled = false
        self.lineChartView.xAxis.drawGridLinesEnabled = false
        self.lineChartView.xAxis.drawAxisLineEnabled = false
        self.lineChartView.rightAxis.drawGridLinesEnabled = false
        self.lineChartView.rightAxis.drawAxisLineEnabled = false
        self.lineChartView.leftAxis.drawGridLinesEnabled = false
        self.lineChartView.leftAxis.drawAxisLineEnabled = false
        self.lineChartView.animate(yAxisDuration: 1.0)

        setChartData(months, yValsArr: dollars1)
    }


    func setChartData(xValsArr: [String], yValsArr: [Double]) {

        for (index, item) in xValsArr.enumerate() {
            yVals1.append(ChartDataEntry(value: yValsArr[index], xIndex: index))
        }


        let set1: LineChartDataSet = LineChartDataSet(yVals: yVals1, label: "First Set")
        set1.axisDependency = .Left // Line will correlate with left axis values
        set1.setColor(UIColor.redColor().colorWithAlphaComponent(0.5)) // our line's opacity is 50%
        set1.drawCirclesEnabled = false
        set1.lineWidth = 0.5
        set1.circleRadius = 6.0 // the radius of the node circle
        set1.fillAlpha = 65 / 255.0
        set1.fillColor = UIColor.redColor()
        set1.drawFilledEnabled = true
        set1.highlightColor = UIColor.whiteColor()
        set1.drawCircleHoleEnabled = true

        //3 - create an array to store our LineChartDataSets
        var dataSets : [LineChartDataSet] = [LineChartDataSet]()
        dataSets.append(set1)

        //4 - pass our months in for our x-axis label value along with our dataSets
        let data: LineChartData = LineChartData(xVals: xValsArr, dataSets: dataSets)
        data.setValueTextColor(UIColor.whiteColor())

        //5 - finally set our data
        self.lineChartView.data = data
    }

}

找到答案here

  1. 添加图表委托协议ChartViewDelegate
  2. 将委托变量设置为 self self.lineChartView.delegate = self
  3. 添加委托协议中的可选功能chartValueSelected

.

class MotoChart: UIView, ChartViewDelegate {

@IBOutlet weak var lineChartView: LineChartView!

// 1 - creating an array of data entries
var yVals1 : [ChartDataEntry] = [ChartDataEntry]()
let months = ["Jan" , "Feb", "Mar", "Apr", "May", "June", "July", "August", "Sept", "Oct", "Nov", "Dec"]
let dollars1 = [1453.0,2352,5431,1442,5451,6486,1173,5678,9234,1345,9411,2212]


//MARK: overrides
override func prepareForInterfaceBuilder() {
    super.prepareForInterfaceBuilder()
}

override func awakeFromNib() {
}


func setupChart(routeMaster: RouteMaster){

    self.lineChartView.delegate = self
    self.lineChartView.descriptionText = "Speed"
    self.lineChartView.descriptionTextColor = UIColor.blackColor()
    self.lineChartView.gridBackgroundColor = UIColor.darkGrayColor()
    self.lineChartView.noDataText = "No data provided"
    self.lineChartView.rightAxis.enabled = false
    self.lineChartView.drawGridBackgroundEnabled = false
    self.lineChartView.doubleTapToZoomEnabled = false
    self.lineChartView.xAxis.drawGridLinesEnabled = false
    self.lineChartView.xAxis.drawAxisLineEnabled = false
    self.lineChartView.rightAxis.drawGridLinesEnabled = false
    self.lineChartView.rightAxis.drawAxisLineEnabled = false
    self.lineChartView.leftAxis.drawGridLinesEnabled = false
    self.lineChartView.leftAxis.drawAxisLineEnabled = false
    self.lineChartView.animate(yAxisDuration: 1.0)

    setChartData(months, yValsArr: dollars1)
}


func setChartData(xValsArr: [String], yValsArr: [Double]) {

    for (index, item) in xValsArr.enumerate() {
        yVals1.append(ChartDataEntry(value: yValsArr[index], xIndex: index))
    }


    let set1: LineChartDataSet = LineChartDataSet(yVals: yVals1, label: "First Set")
    set1.axisDependency = .Left // Line will correlate with left axis values
    set1.setColor(UIColor.redColor().colorWithAlphaComponent(0.5)) // our line's opacity is 50%
    set1.drawCirclesEnabled = false
    set1.lineWidth = 0.5
    set1.circleRadius = 6.0 // the radius of the node circle
    set1.fillAlpha = 65 / 255.0
    set1.fillColor = UIColor.redColor()
    set1.drawFilledEnabled = true
    set1.highlightColor = UIColor.whiteColor()
    set1.drawCircleHoleEnabled = true

    //3 - create an array to store our LineChartDataSets
    var dataSets : [LineChartDataSet] = [LineChartDataSet]()
    dataSets.append(set1)

    //4 - pass our months in for our x-axis label value along with our dataSets
    let data: LineChartData = LineChartData(xVals: xValsArr, dataSets: dataSets)
    data.setValueTextColor(UIColor.whiteColor())

    //5 - finally set our data
    self.lineChartView.data = data
}

func chartValueSelected(chartView: ChartViewBase, entry: ChartDataEntry, dataSetIndex: Int, highlight: ChartHighlight) {
    print(" Chart Value \(entry.value)  \(entry.xIndex)")
}}

}