willdale / SwiftUICharts

A charts / plotting library for SwiftUI. Works on macOS, iOS, watchOS, and tvOS and has accessibility features built in.
MIT License
843 stars 105 forks source link

Option to Hide Chart Line between certain points? #173

Open gesabo opened 2 years ago

gesabo commented 2 years ago

I'm working on a chart that has a few values that begin at 0 until the first point that is above 0. I need the 0 points there to preserve proper spacing, but I also need a line between my points. So my chart has a line at zero until the first point (see below) I don't think there's a way to handle this currently? It would be nice to be able to control the points the line begins and ends etc.

image

gesabo commented 2 years ago

It might be best to be able to change the color of the line between certain points, that was you can use .clear if you want to hide it, but also gives the option to make the chart more dynamic by changing the color of the line above or below certain thresholds.

fredeiden commented 2 years ago

Try setting ignoreZero to true in LineStyle and see if that helps. It worked well for me in a multi-line chart where the sets of data points did not have the same number of values. I padded the shorter set with zeros and presented a chart line that stopped sooner than its counterpart.

Screen Shot 2022-02-17 at 2 43 59 PM
gesabo commented 2 years ago

@fredeiden thanks I've used ignoreZero to solve other issues but here particularly I was looking to keep the zero values so that they took up a space on the X Axis (yet not color the line above them)

fredeiden commented 2 years ago

Here is another idea. This is cheating, but it looks right to an observer. How about a MultiLineChart with two LineDataSet elements. One is your set of numbers greater than zero, but padded with zeros at the front to push it to the right. This has a LineStyle with ignoreZero set to true. The second LineDataSet has leading values of 0.01 and then trailing zeros. This uses a LineStyle with a strokeStyle of Stroke(lineWidth: 0.0) and ignoreZero true. In short, use a line of zero thickness when you only want to see the points.

Here is my test code and the chart it generates:

` import SwiftUI import SwiftUICharts

struct Chart: View {

var body: some View {

    let data = lineData()

    HStack {
        MultiLineChart(chartData: data)
            .pointMarkers(chartData: data)
            .xAxisGrid(chartData: data)
            .yAxisGrid(chartData: data)
            .padding()
    }

}

func lineData() -> MultiLineChartData {

    let lineStyleOne = LineStyle(lineType: .line,
                                 strokeStyle: Stroke(lineWidth: 1.0),
                                 ignoreZero: true)

    let lineStyleTwo = LineStyle(lineType: .line,
                                 strokeStyle: Stroke(lineWidth: 0.0),
                                 ignoreZero: true)

    let dataSets = [
        LineDataSet(dataPoints: [0,0,2,5,3,4,5,6,7,8].map { LineChartDataPoint(value: $0) },
                    style: lineStyleOne),
        LineDataSet(dataPoints: [0.01,0.01,0,0,0,0,0,0,0,0].map { LineChartDataPoint(value: $0) },
                    style: lineStyleTwo)
    ]

    return MultiLineChartData(dataSets: MultiLineDataSet(dataSets: dataSets))
}

} `

Screen Shot 2022-02-18 at 9 16 41 PM
gesabo commented 2 years ago

@fredeiden good thought and very clever! I will give a shot!