Synchronizing scrolling/pan/highlight of multiple views.

[moon47usaco]

I know this question has been asked but in each response I found the answer was really vague and only mentioned looking at the ChartViewPortHandler and ChartTransformer classes but did not detail how the solution should be coded.

The translate is my biggest problem. When I move one chart in the x axis I want the other to fallow.

I have the main view controller class set as

class ViewController: NSViewController, ChartViewDelegate{

With the fallowing set in the view did load:

combinedChartView.delegate = self

I have tried the fallowing to synch the x axis translation but it does not have any effect:

func chartTranslated(chartView: ChartViewBase, dX: CGFloat, dY: CGFloat) {
        if  chartView == combinedChartView {
            lineChartView.setDragOffsetX(dX)
        }else {
            combinedChartView.setDragOffsetX(dX)
        }
    }

I have half way solved the highlight line but it does not work in both views.

The fallowing function passes the crosshair/highlight line from the above combined (candle, line) chart to the line chart below but clicking in the lower line chart does not sync with the upper combined chart. It does work to some degree if I move around in the lower view it will finally draw in the upper at certain locations .

    func chartValueSelected(chartView: ChartViewBase, entry: ChartDataEntry, dataSetIndex: Int, highlight: ChartHighlight) {
        //print("\(entry.value) in \(xValues[entry.xIndex])")//how to get OHCL
        if  chartView == combinedChartView {
            lineChartView.highlightValues([highlight])
        }else {
            combinedChartView.highlightValues([highlight])
        }
    }

Please be specific with examples if possible.

Thank you,

R

[liuxuan30]

The reason I just mention 'ChartTransformer' and 'ChartViewPortHandler' is we don't have a working solution and I didn't implement it. What I mean is these classes contain the methods and show you how the zooming, scrolling works.

Syncing between charts especially for the zooming/scrolling state requires you understand the library in depth..I can't talk in details because it's too many to say.. It's better that developer can walk through the code themselves.

setDragOffsetX seems not what you think it is

    /// Set an offset in dp that allows the user to drag the chart over it's
    /// bounds on the x-axis.
    public func setDragOffsetX(_ offset: CGFloat)
    {
        _viewPortHandler.setDragOffsetX(offset)
    }

There are moveViewToX shows you how to move view to speific x position. At last you will find it's about refresh(newMatrix: CGAffineTransform, chart: ChartViewBase, invalidate: Bool) -> CGAffineTransform

As for the highlight... I don't see issues with the code and don't fully understand are you talking about library bug or just you don't know how to use it. And again.. should be easier to debug on your side. Knowing the library takes time, so..

[moon47usaco]

Thanks I will look into what you mentioned. I thought I read in another issue that refresh was not the solution but I will try that as well.

As for highlight or the crosshair more importantly if there is only a candle in the top and a line in the bottom I see no sync between the bot to the top but the top translates to the bottom just fine.

If there is a combined line/candle in the top and a line in the bottom I get very sporadic results especially if the line in the combined upper chart has fewer data points than the candle. I will open another issue for that and be more specific once I do some more detailed testing.

Thank you again for the point in the correct direction for the xAxis sync.

[liuxuan30]

refresh is the method to apply matrix with chart, so it's a high level API to use. What I mean is that you have to understand how the zoom/scroll works, and maybe you can figure a way to sync your charts.

Highlight takes x index, data set index, entry index etc. in order to correctly highlight the object you want. When you syncing highlights between charts, you have to think about is the index correct for each data set. e.g. the highlighted line dot circle data set index/entry index may not be same in another line chart, although they look the same.

[moon47usaco]

Excellent, thank you for the direction.

With a little help from an example for mpandroidchart at http://bit.ly/2c7bRfU I was able to put the below function together. Works quite well.

How would I restrict the matrix to only apply to the xaxis?

I do not want the function to affect the y value of either chart only the pan back and forth in x.

In the mpandroidchart example the answer is using getValues() and setValues() on the returned matrix. Do we have something like this so I can specify only the otherVals[Matrix.MTRANS_X] like the answer does and skip the scale?

    func chartTranslated(chartView: ChartViewBase, dX: CGFloat, dY: CGFloat) {

        if  chartView == combinedChartView {
            let currentMatrix = chartView.viewPortHandler.touchMatrix
            lineChartView.viewPortHandler.refresh(newMatrix: currentMatrix, chart: lineChartView, invalidate: true)
        }else {
            let currentMatrix = chartView.viewPortHandler.touchMatrix
            combinedChartView.viewPortHandler.refresh(newMatrix: currentMatrix, chart: combinedChartView, invalidate: true)
        }
    }

[moon47usaco]

This works but it may be more complicated than it needs to be.

Also I would like to use functions specific to the library rather than calling swift specific functions so when I port over to Java using mpandroidchart then I do not need to reformat to Java functionality but just use the mpandroidchart libraries counter part.

    func chartTranslated(chartView: ChartViewBase, dX: CGFloat, dY: CGFloat) {

        if  chartView == combinedChartView {
            let newMatrix = chartView.viewPortHandler.touchMatrix
            let oldMatrix = lineChartView.viewPortHandler.touchMatrix
            let currentMatrix = CGAffineTransformMake(oldMatrix.a, oldMatrix.b, oldMatrix.c, oldMatrix.d, newMatrix.tx, oldMatrix.ty)
            lineChartView.viewPortHandler.refresh(newMatrix: currentMatrix, chart: lineChartView, invalidate: true)
        }else {
            let newMatrix = chartView.viewPortHandler.touchMatrix
            let oldMatrix = combinedChartView.viewPortHandler.touchMatrix
            let currentMatrix = CGAffineTransformMake(oldMatrix.a, oldMatrix.b, oldMatrix.c, oldMatrix.d, newMatrix.tx, oldMatrix.ty)
            combinedChartView.viewPortHandler.refresh(newMatrix: currentMatrix, chart: combinedChartView, invalidate: true)
        }
    }