chart

Documentation

Overview

Package chart is a bar, line or area chart. The server renders the data as a table, and the ChartCanvas island draws it as SVG.

Index

• Variables
• func Chart(p ChartProps) gx.Node
• func ChartCanvas(p ChartCanvasProps, opts ...gx.IslandOption) gx.Node
• type CanvasClasses
• type ChartCanvasProps
• type ChartProps
• type Kind
• type Series

Variables

var ChartFixtures = gx.Fixtures[ChartProps]{
	"Bar":  {Id: "chart-bar", Title: "Visitors", Categories: months, Series: visitors},
	"Line": {Id: "chart-line", Title: "Visitors", Kind: Line, Categories: months, Series: visitors},
	"Area": {Id: "chart-area", Title: "Visitors", Kind: Area, Categories: months, Series: desktop},
}

Functions

func Chart

func Chart(p ChartProps) gx.Node

func ChartCanvas

func ChartCanvas(p ChartCanvasProps, opts ...gx.IslandOption) gx.Node

ChartCanvas renders the island of ChartCanvas.ts (REQ-ISL-01). The browser mounts it with the props as JSON. An option sets the time of the load.

Types

type CanvasClasses

type CanvasClasses struct {
	Root       string `json:"root"`
	Figure     string `json:"figure"`
	SVG        string `json:"svg"`
	Grid       string `json:"grid"`
	Axis       string `json:"axis"`
	Highlight  string `json:"highlight"`
	Tooltip    string `json:"tooltip"`
	Legend     string `json:"legend"`
	LegendItem string `json:"legendItem"`
	Swatch     string `json:"swatch"`
	Hidden     string `json:"hidden"`
}

CanvasClasses are the classes of the parts that the island draws.

type ChartCanvasProps

type ChartCanvasProps struct {
	// Table is the id of the data table that the island takes out of view.
	Table string `json:"table"`
	// Label is the accessible name of the drawing.
	Label string `json:"label"`
	// Kind is "bar", "line" or "area".
	Kind string `json:"kind"`
	// Categories are the labels of the horizontal axis.
	Categories []string `json:"categories"`
	// Series are the rows of numbers.
	Series []Series `json:"series"`
	// Classes holds the classes of the parts. They are Go constants, so
	// the stylesheet build sees them.
	Classes CanvasClasses `json:"classes"`
}

ChartCanvasProps are the props of the island that draws the chart.

type ChartProps

type ChartProps struct {
	// Id is the id of the root element.
	Id string
	// Title is the caption of the chart and its accessible name.
	Title string
	// Kind sets the drawing: Bar, Line or Area.
	Kind Kind
	// Categories are the labels of the horizontal axis, in order.
	Categories []string
	// Series are the rows of numbers: one value for each category.
	Series []Series
	// Class adds classes to the root element.
	Class string
	// Attrs adds HTML attributes to the root element.
	Attrs gx.Attrs
}

type Kind

type Kind string

Kind is the drawing of a chart.

const (
	Bar  Kind = "bar"
	Line Kind = "line"
	Area Kind = "area"
)

The kinds of chart.Chart.

type Series

type Series struct {
	// Name is the name of the series in the legend.
	Name string `json:"name"`
	// Values holds one value for each category.
	Values []float64 `json:"values"`
}

Series is one row of numbers with a name.