Swiftpack.co - maxhumber/Sankey as Swift Package

About

Sankey diagrams in SwiftUI, powered by Google Charts^‡

Quickstart

Make interactive charts like this:

With code as simple as this:

import Sankey
import SwiftUI

struct ReadMeView: View {
    // Create some data
    @State var data: [SankeyLink] = [
        // Option A: ExpressibleByArrayLiteral
        ["A", "X", "5"],
        ["A", "Y", "7"],
        ["A", "Z", "6"],
        ["B", "X", "2"],
        ["B", "Y", "9"],
        ["B", "Z", "4"]
    ]

    var body: some View {
        GeometryReader { geo in
            VStack(spacing: 20) {
                Text("Sankeys in SwiftUI!")
                    .font(.title3.bold())
                    .padding(.top, 20)
                // Native SwiftUI Component
                SankeyDiagram(
                    data,
                    nodeLabelFontSize: 50,
                    nodeInteractivity: true,
                    linkColorMode: .gradient,
                    tooltipTextFontSize: 50
                )
                // Will take up full View, unless you constrain it...
                .frame(height: geo.size.height * 0.5)
                Button {
                    data.append(
                        // Option B: Struct
                        SankeyLink(source: "C", target: "X", value: 3)
                    )
                } label: {
                    Text("Add a new link")
                }
                Text("Lorem Ipsum...")
            }
        }
    }
}

Examples

Inspired by the examples in the Google Charts Gallery

• Simple Sankey | Code | Inspiration

SankeyDiagram([
    ["A", "X", "5"],
    ["A", "Y", "7"],
    ["A", "Z", "6"],
    ["B", "X", "2"],
    ["B", "Y", "9"],
    ["B", "Z", "4"]
])

• Multilevel Sankey | Code | Inspiration

SankeyDiagram(data)

• Gradient Links | Code | Inspiration

let colors = [
    "#a6cee3", "#b2df8a", "#fb9a99", "#fdbf6f",
    "#cab2d6", "#ffff99", "#1f78b4", "#33a02c"
]	

SankeyDiagram(
    data,
    nodeColors: colors,
    linkColors: colors,
    linkColorMode: .gradient
)

• Uniform Color | Code | Inspiration

SankeyDiagram(
    data,
    nodeColors: ["#a61d4c"],
    nodeLabelColor: "#871b47",
    linkColorFill: "#d799ae",
    linkColorFillOpacity: 0.8
)

• Stroked Links | Code | Inspiration

SankeyDiagram(
    data,
    nodeColors: ["#a61d4c"],
    linkColorStroke: "black",
    linkColorStrokeWidth: 1
)

• Label Style | Code | Inspiration

SankeyDiagram(
    data,
    nodeLabelColor: "#871b47",
    nodeLabelFontSize: 32,
    nodeLabelFontName: "Times-Roman",
    nodeLabelBold: true,
    nodeLabelItalic: true
)

• Label Padding | Code | Inspiration

SankeyDiagram(
    data,
    nodeLabelPadding: 30
)

• Node Width | Code | Inspiration

SankeyDiagram(
    data,
    nodeWidth: 24
)

• Node Padding | Code | Inspiration

SankeyDiagram(
    data,
    nodePadding: 40
)

• Data | Code | Inspiration

let data: [SankeyLink] = [
    ["Brazil", "Portugal", "5"],
    ["Brazil", "France", "1"],
    ["Brazil", "Spain", "1"],
    ["Brazil", "England", "1"],
    ["Canada", "Portugal", "1"],
    ["Canada", "France", "5"],
    ["Canada", "England", "1"],
    ["Mexico", "Portugal", "1"],
    ["Mexico", "France", "1"],
    ["Mexico", "Spain", "5"],
    ["Mexico", "England", "1"],
    ["USA", "Portugal", "1"],
    ["USA", "France", "1"],
    ["USA", "Spain", "1"],
    ["USA", "England", "5"],
    ["Portugal", "Angola", "2"],
    ["Portugal", "Senegal", "1"],
    ["Portugal", "Morocco", "1"],
    ["Portugal", "South Africa", "3"],
    ["France", "Angola", "1"],
    ["France", "Senegal", "3"],
    ["France", "Mali", "3"],
    ["France", "Morocco", "3"],
    ["France", "South Africa", "1"],
    ["Spain", "Senegal", "1"],
    ["Spain", "Morocco", "3"],
    ["Spain", "South Africa", "1"],
    ["England", "Angola", "1"],
    ["England", "Senegal", "1"],
    ["England", "Morocco", "2"],
    ["England", "South Africa", "7"],
    ["South Africa", "China", "5"],
    ["South Africa", "India", "1"],
    ["South Africa", "Japan", "3"],
    ["Angola", "China", "5"],
    ["Angola", "India", "1"],
    ["Angola", "Japan", "3"],
    ["Senegal", "China", "5"],
    ["Senegal", "India", "1"],
    ["Senegal", "Japan", "3"],
    ["Mali", "China", "5"],
    ["Mali", "India", "1"],
    ["Mali", "Japan", "3"],
    ["Morocco", "China", "5"],
    ["Morocco", "India", "1"],
    ["Morocco", "Japan", "3"]
]

API

Optional SankeyDiagram(data, ...) styling arguments :

For more information see configuration options

Swift Package Manager

Add to your project with:

dependencies: [
    .package(url: "https://github.com/maxhumber/Sankey.git", .upToNextMajor(from: "1.0"))
]

Fine Print

^{‡ Active network connection required}