Highlight sync between combined and line views

[moon47usaco]

I am having issues with getting the crosshairs or highlight line to sync with two chart views I have.

I have two different problems, second one is detailed in next comment:

First and most important is the passing of the highlight line to the other chart:

The top view is a combined chart view with a candlestick chart and a line chart.

The bottom view is a line chart. All data is from the same source with same xValues. The yValues are the same just adjusted to illustrate the issue I am having.

You can see an example of the code: here https://github.com/moon47usaco/Highlight_Sync-01

I am using the bellow function to pass the highlight value to the other chart:

    func chartValueSelected(chartView: ChartViewBase, entry: ChartDataEntry, dataSetIndex: Int, highlight: ChartHighlight) {
        if  chartView == combinedChartView {
            lineChartView.highlightValues([highlight])
        }else {
            combinedChartView.highlightValues([highlight])
        }
    }

This works fine for the candlestick or combined chart to pass values to the lower line chart but not the other way around.

I have the line chart in the upper combined view set to lineOverlayChartDataSet.highlightEnabled = false and if i set this to true the bottom chart will sync with the line but that is not the desired result. I would like the bottom line chart to sync with the upper candlestick chart.

[moon47usaco]

I also want to set the margin of the yValues text on both the right and left to be the same as the top combined chart regardless of the numerical value.

For instance in the first screenshot the numerical values are the same so everything lines up perfectly.

However in the second the numerical values are different so the margin automatically scales the chart view to be larger in the bottom view because it has room to do so. I do not want it to do that but have the margin for the text and chart view always the same.

Same values everything lines up.

Values in lower fire are numerically smaller (divided by 1000) so the lower chart stretches to fit.

[liuxuan30]

As I said earlier in another of your post #1415 Passing highlight objects may not be correct. Combined chart is composed of different data sets, each data set has many entries. If you want to pass line chart highlight to combined chart, you first have to figure out which data set index it is in Combined chart.
You have to look carefully about CombinedChartHighlighter and ChartHighlighter to see the difference. Remember all the time, you need to know the exact dataSetIndex in different charts and create the correct mapping.

[moon47usaco]

Thanks again, I was not really sure what you meant in the earlier post, but this is much more clear. I will look into what you mentioned here and post my results for others once I find a resolution.

What about the margins for the number differences that make the charts different sizes?

[liuxuan30]

could be some reasons. In your chart, the y axis labels is different width, so the contentRect width is different. There is extraLeftOffset extraRightOffset to set.

But remember, chart view bounds - left/right axis label width - extra offset = chart rendering area width
If you want to make sure two charts contentRect is the same, you need some extra work. Like make sure the y axis labels has same width all the time.

[moon47usaco]

Excellent. That works wonderfully... =]
All I need to do is get the bottom width - top width and add half of that to extraLeftOffset and extraRightOffset.

[moon47usaco]

I am still a little confused about the highlighter. I currently only have one chart in the combined chart (removed the other for testing) so the index should be 0 correct?

I tried the fallowing and the bottom line chart is still in sync with the upper combined chart but the highlighter completely disappears from the combined chart with clicks in the lower chart.

    func chartValueSelected(chartView: ChartViewBase, entry: ChartDataEntry, dataSetIndex: Int, highlight: ChartHighlight) {
        if  chartView == combinedChartView {
            lineChartView.highlightValues([highlight])
        }else {
            combinedChartView.highlightValue(xIndex: entry.xIndex, dataSetIndex: 0)
        }
    }

If I use the highlightValue function in the combinedChartView if and else statements the highlighter in the combine view disappears completely when clicking in both views but the bottom chart is still in sync.

Do I need to write a custom "chartValueSelected" function that takes the CombinedChartHighlighter functionality into account.

The reason I ask is that when I print out the value of the highlight: ChartHighlight when I select the combined chart i get a dataSetIndex of -1 and that is not expected:

Highlight, xIndex: 527, dataIndex (combined charts): -1,dataSetIndex: -1, stackIndex (only stacked barentry): -1, value: nan

But for the line chart below i get expected results:

Highlight, xIndex: 445, dataIndex (combined charts): 0,dataSetIndex: 0, stackIndex (only stacked barentry): -1, value: 66.684362450327

[liuxuan30]

Highlight, xIndex: 527, dataIndex (combined charts): -1,dataSetIndex: -1, stackIndex (only stacked barentry): -1, value: nan

this seems an old issue in 2.2.5, by default its all -1. I would suggest you try v3

[moon47usaco]

Yikes... !! I tried to fix as much as possible to allow the previous code to work with V3 but it has changed allot and the way I have my setChart function now will no longer work.

There are 5 lines of code that have changed dramatically in the way the data entry is handed so that it does not allow me to use the same process. What were int index values are now doubles and setting the xValues with the ChartData classes before appending the yValues is no longer the same.

See lines 133, 146, 168, 219, 227 in this repo.
http://bit.ly/2cbxBEC

I have removed my API key so it will not load data but if I can get help reworking those processes then I can test the highlight with V3.

[moon47usaco]

I was able to convert my code to work with V3 although I am not sure if I like the way xIndex was removed, I'll explain below.

As for the highlight issue with the highlight was a bug in the 2.2.5 code returning -1 for the combined chart view.

In V3 the below code works as expected:

    func chartValueSelected(chartView: ChartViewBase, entry: ChartDataEntry, highlight: Highlight) {
        if  chartView == combinedChartView {
            lineChartView.highlightValues([highlight])
            print(entry)
        }else {
            combinedChartView.highlightValues([highlight])
            print(entry)
        }

    }

[moon47usaco]

While somewhat unrelated the issue about the xIndex change in V3 is causing the highlight lines to be correct in location for each data set but visually offset.

With the removal of the xIndex it produces a problem for me as I have one data set (candles) that starts at 0 and ends in the last candle entry.

My other plot however is not calculated until the 14th bar on the candle chart so it starts at xIndex of 13 and goes until the end.

In 2.2.5 I could simply not add the yValues at the first 13 xValues and it would draw the chart with no line data until the 13th xIndex. In the code below my yVals array has optional nil values where the data is not calculated yet in the first 13 entries.

        var indicatorLower_yValues_Multi: [[ChartDataEntry]] = []
        for ii in 0..<indicatorLowerValues.count {
            var indicatorLower_yValues: [ChartDataEntry] = []
            for i in 0..<xValues.count {
                if let indicatorLower = indicatorLowerValues[ii][i] {
                    let indicatorLower_yValue = ChartDataEntry(value: indicatorLower, xIndex: i)
                    indicatorLower_yValues.append(indicatorLower_yValue)
                }
            }
            indicatorLower_yValues_Multi.append(indicatorLower_yValues)
            indicatorLower_yValues = []
        }

In V3 the chart stars drawing at x of 13 (using 0 index for 1st bar) so the charts no longer match up.

In V3 how do I draw a chart with empty values for the first 13 entries?

Screens:

V2.2.5 with leading blank data for first 13 entries:

V3 with no leading empty entries. Chart starts at x=13 not x=0 as with V2.2.5: