如何使用ios-charts创建浮动图标记 [英] How to create a floating graph marker with ios-charts

问题描述

我正在使用ios-charts框架，并希望创建一个标记，当我触摸并从一侧移动到另一侧时，浮动图形。我正在使用折线图作为参考。

I'm using the ios-charts framework and want to create a marker that floats over the graph when I touch and move my finger from side to side. I'm using a line chart just for reference.

然而，当我触摸它时，我无法弄清楚如何在图表上获得标记的位置。

However, I can't figure out how to get the position of the marker on the chart when I touch it.

我读过有关继承MarkerView的子类，但这不起作用。你能告诉我当你触摸ios图表时如何获得显示点的位置吗？

I've read about subclassing MarkerView but that isn't working. Can you please show me how to get the position of the point that shows up when you touch an ios-chart?

推荐答案

所以我终于让它工作了，并希望将它添加到社区。以下是我的图表：

So I finally got this to work and wanted to add it to the community. Here is what my chart looks like:

何时你在图表上用手指移动上面的读者移动并从图表中读取值。

When you run your finger over the chart the the reader above moves and reads the value from the chart.

为了使这个工作，我必须做以下事情：

To get this to work I had to do the following:

1. 在您实施图表的文件中，请务必包含
   ChartViewDelegate

然后实施 chartValueSelected 方法。

如果您再使用 getMarkerPosition 方法，您可以将标记居中放在任何位置。

If you then use the getMarkerPosition method, you'll be able to center your "marker" wherever you want.

以下是一些示例代码：

class MarkerView: UIView {
    @IBOutlet var valueLabel: UILabel!
    @IBOutlet var metricLabel: UILabel!
    @IBOutlet var dateLabel: UILabel!
}

let markerView = MarkerView()

func chartValueSelected(chartView: ChartViewBase, entry: ChartDataEntry, dataSetIndex: Int, highlight: ChartHighlight) { 

    let graphPoint = chartView.getMarkerPosition(entry: entry,  highlight: highlight)

    // Adding top marker
    markerView.valueLabel.text = "\(entry.value)"
    markerView.dateLabel.text = "\(months[entry.xIndex])"
    markerView.center = CGPointMake(graphPoint.x, markerView.center.y)
    markerView.hidden = false

}

markerView 是我手动添加到主视图的xib，其中还包含图表视图。 markerView 是一个包含三个标签的UIView。这是图片中的3.0，印象和4月。

markerView is a xib that I added manually to the main view that also contains the graph view. markerView is a UIView that contains three labels. It's the 3.0, impressions, and Apr you see in the picture.

graphPoint 是位于图表上的CGPoint 。您可以使用 graphPoint 的x和y重新定位 markerView 。在这里，我只是将 markerView 的y值保持不变，并更改了它的x值，使其在触摸时来回移动。

graphPoint is the CGPoint located on the graph. You can use the x and y of the graphPoint to reposition your markerView. Here I simply kept the y value of the markerView the same and changed it's x-value to make it move back and forth on touch.

这篇关于如何使用ios-charts创建浮动图标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！