V2 version of SwiftUI ChartView

[AppPear]

The goal is to have a new more easily expandable codebase, setup with CI and test so PRs could be merged quicker and safer.

If you would like to help and participate in the new version you are very welcomed you can find project related tasks here or under the Issues with a v2 tag

to submit your work please fork this repo and create a new branch from new-version branch then update with your work and create a PR for the new-version branch.

If you work on a ticket please go to the project board and assign the ticket to yourself and move it to the in-progress column. If you are finished please assign the newly created PR to me and move your ticket to the ready-for-review column.

Join our Slack channel for day to day conversation and more insights:

slack invite link

New code proposal:

ChartViews

These chart views come with the bare minimum for a chart, so it can be easily built into custom user interfaces. We also build on them for the more complex chart widgets.

Data

• should be a structure which can hold a x and y value.
• y value must be numeric (possibly floating point number)
• x can be numeric or string
• has to be at least 3 initialisers: 1) only y values, 2) x and y numeric values 3) x string and y numeric values

Barchart:

@State var chartData: [Double] = [0, 5, 6, 2, 13, 4, 3, 6]

BarChart()
.data(chartData)
.style(lightOrange)

Linechart:

@State var chartData: [Double] = [0, 5, 6, 2, 13, 4, 3, 6]

LineChart()
.data(chartData)
.style(lightOrange)

Piechart:

@State var chartData: [Double] = [0, 5, 6, 2, 13, 4, 3, 6]

PieChart()
.data(chartData)
.style(lightOrange)

Grid (not in beta 1)

• is a view under a chart
• should support barchart and linechart
• legend ranges can be user set
• legend ranges can be automatic
• user can set a custom style (colors)

Grid {
    BarChart()
}
.data(chartData)
.style(lightOrange)

Cardview

• support for all charts
• a holder for the chart, title, subtitle
• support for displaying x axis values interactively
• should be rounded
• light versions have a shadow around them
• dark versions have a thin light bezel
• have 3 size presets: small, medium, large
• user can set a custom style (colors)
• has a defualt style so setting a style is optional

CardView {
        BarChart()
}
.data(chartData)
.style(darkBlue)

ChartData (beta 1 supports Chart init with [Double] only)

ChartData is an observable object so you can make state changes and it will be reflected now in the charts.

To initialise:

ChartData(_ data: [Double])

and to make a state change:

@State var chartData = ChartData([0, 4, 5])
.
.
.
chartData.data = [0, 2, 6, 7, 8, 11]

[satan87]

I believe this will break a lot of other PR. But looks cleaner, and easier so I don't mind adapting my PR.

[LucasCarioca]

@AppPear With this in the works, should people hold off on PRs?

Do you want to open up issues to break up this change and get help implementing it?

[satan87]

To participate in the new branch, how the best way to do it? Just fork it, update it, then create a PR?

[AppPear]

Yes, please fork it and create a PR for the new-version branch. You can find some task under the issues with a v2 tag or you can go to the project board and find the tickets I created and would be very helpful if you could work on those.

Thanks!

[satan87]

ok, I'll try working on the PieChart, but no promises;(.

[satan87]

~~I created a first PR with minimum changes, to make sure I follow your guidelines.~~ Sorry for the double commit on the PR. I added PieChart and multicolor for Bar and Pie. I also added a swiftlint file, it helps me. You can remove it, or adapt it to your style.

Maybe we could create chat somewhere to coordinate.

[AdrianBinDC]

@AppPear I love the philosophy re: building the charts w/ the bare minimum and building upon it. One suggestion I have is writing unit tests to go along with committed code, rather than treating it as an afterthought. I'll take a peek at code coverage and see what I can unearth that's testable.

[L1cardo]

Looking forward to this！！ This will be awesome！

[AppPear]

~I created a first PR with minimum changes, to make sure I follow your guidelines.~

Thanks, I merged it! Only small issue was accentColor:self.style.foregroundColor.rotate(for: index) that .rotate() functions was undefined so I had to remove it if you could do a fix PR defining it and reimplementing that would be awesome! @satan87

[satan87]

~I created a first PR with minimum changes, to make sure I follow your guidelines.~

Thanks, I merged it! Only small issue was accentColor:self.style.foregroundColor.rotate(for: index) that .rotate() functions was undefined so I had to remove it if you could do a fix PR defining it and reimplementing that would be awesome! @satan87

The extension file wasn't in my commit;( sorry. PR #102

[satan87]

Hello, Is there a way in V2 to show labels? I see some code, but not sure how to add it to a chart? Thanks, Nicolas

PS: As it seems there are a couple of persons interested in the project, maybe we could set up a Sclak or something similar

[satan87]

I spend some time trying to add the TITLE in the Chart View but I couldn't do it. I didn't fully grasp the whole concept yet... Nicolas

[AppPear]

@satan87 slack channel is a great idea I updated the PRs description with the invite link.

Currently the TitleLabel and the ChartsLabel files are I think a dead end. I have a different solution in mind.

I think would be better to have a CardView as a container view to hold the title and the chartview. CardView would have viewbuilder and would work something like this:

CardView { Title(“Text”) ChartView(...) }

[LucasCarioca]

Tried out the Beta and it is looking pretty cool. How close is this to getting released?

[shreyaspapi]

Waiting for the release😁

[kakashilw]

In my widget i import SwiftUICharts. 2.0.0-beta.1，and my code

import SwiftUICharts

...............

struct TestWidgetView : View {

var entry: TestEntry


var body: some SwiftUI.View {
    
    let orangeStyle = ChartStyle(backgroundColor: .white,
                                 foregroundColor: [ColorGradient(ChartColors.orangeBright, ChartColors.orangeDark)])
    LineChart()
    .data([0, 5, 6, 2, 13, 4, 3, 6])
    .chartStyle(orangeStyle)

}

}

and run，the errors：

Showing Recent Messages Undefined symbol: nominal type descriptor for SwiftUICharts.ChartStyle

Undefined symbol: nominal type descriptor for SwiftUICharts.LineChart

Undefined symbol: nominal type descriptor for SwiftUICharts.ChartData

Undefined symbol: nominal type descriptor for SwiftUICharts.ChartValue

Undefined symbol: protocol conformance descriptor for SwiftUICharts.LineChart : SwiftUI.View in SwiftUICharts

Undefined symbol: SwiftUICharts.ColorGradient.init(SwiftUI.Color, SwiftUI.Color) -> SwiftUICharts.ColorGradient

Undefined symbol: SwiftUICharts.ChartColors.orangeDark.unsafeMutableAddressor : SwiftUI.Color

Undefined symbol: type metadata accessor for SwiftUICharts.ChartStyle

Undefined symbol: SwiftUICharts.LineChart.init() -> SwiftUICharts.LineChart

Undefined symbol: type metadata for SwiftUICharts.ColorGradient

Undefined symbol: SwiftUICharts.ChartColors.orangeBright.unsafeMutableAddressor : SwiftUI.Color

Undefined symbol: type metadata for SwiftUICharts.LineChart

Undefined symbol: protocol witness table for SwiftUICharts.LineChart : SwiftUICharts.ChartBase in SwiftUICharts

Undefined symbol: SwiftUICharts.ChartStyle.__allocating_init(backgroundColor: SwiftUI.Color, foregroundColor: [SwiftUICharts.ColorGradient]) -> SwiftUICharts.ChartStyle

Undefined symbol: (extension in SwiftUICharts):SwiftUI.View< where A: SwiftUICharts.ChartBase>.data([Swift.Double]) -> some

Undefined symbol: (extension in SwiftUICharts):SwiftUI.View.chartStyle(SwiftUICharts.ChartStyle) -> some

[sgallo0692]

@kakashilw isn't this line:

var body: some SwiftUI.View {

Supposed to be

var body: some View {

[ghost]

Hi, are you still working on this? Last commits are from october 2020. 😢

[kevinmun]

I actually tried importing this and using it in Widget, but it draws blank on both the preview and simulator. ANyone able to get it working?

[ghost]

@kevinmun yes, it works in my application.

[kevinmun]

@kevinmun yes, it works in my application.

I see, I tested it out again, and it seems, it's ok if it's deployed to device. Somehow on preview / simulator, it appears as blank. Weird.

[JanC]

hey, is the v2 still being worked on or is this library not maintained anymore?

[AppPear]

hey, is the v2 still being worked on or is this library not maintained anymore?

Yes, currently I'm on organising a bigger help to maintain and take this lib to next level and release v2 as soon as possible

[ghost]

Hi, I've got a question to BarChart. Tthis is used with key value pairs (String -> Double). If I touch a single Bar in V1, both values are presented. But in V2 only the Double value is shown. Is this a bug, a forgotten feature or wrong usage from my side?

[Prince2k3]

@AppPear I'd like to join as a member. I currently have a candlestick chart working using the new-version branch on my machine. I'm interested in helping out. I like to chat about data structure for support of that type of chart and others.

[AppPear]

@AppPear I'd like to join as a member. I currently have a candlestick chart working using the new-version branch on my machine. I'm interested in helping out. I like to chat about data structure for support of that type of chart and others.

Can you please join the slack channel?

[tpgmeligmeyling]

@AppPear ~~Can you update the Slack invite link?~~ Edit found it in the readme.

[AppPear]

Hi, I've got a question to BarChart. Tthis is used with key value pairs (String -> Double). If I touch a single Bar in V1, both values are presented. But in V2 only the Double value is shown. Is this a bug, a forgotten feature or wrong usage from my side?

it's a missing feature for now, but it is coming soon to v2 as well

[m8xp0w3r]

it's a missing feature for now, but it is coming soon to v2 as well

Thank for the answer.

[rodri0315]

Hello! How's V2 going? Anything we can help?