Struct DonutChart 

pub struct DonutChart<S, T> { /* private fields */ }

A donut chart of the rows of a list signal, each an arc as long as its share of the total.

Each row is a slice labeled by the text field category, and its length is the number field value over the sum of value across the rows. The slices run clockwise from the top in the order of the rows, in the chart colors from token::chart_1 to token::chart_5, which repeat after the fifth row. A negative value counts as 0, since a share cannot be negative. The total is written in the middle of the ring, and the legend names each row with its value.

Each slice sums the rows before it, so a change to the rows costs time that grows with the square of their number.

The ring and the legend are hidden from assistive technology, and a screen reader reads a visually hidden table of the same rows instead, captioned with label.

use hypersig::{Page, Signals};
use hypersig_ui::DonutChart;
use serde::{Deserialize, Serialize};

#[derive(Signals, Serialize, Deserialize)]
struct Browser {
    name: String,
    visitors: i32,
}

#[derive(Signals, Serialize, Deserialize)]
struct Traffic {
    browsers: Vec<Browser>,
}

let chart = DonutChart::new("Browsers", Traffic::browsers(), Browser::name(), Browser::visitors());
let browsers = vec![
    Browser { name: "Chrome".into(), visitors: 275 },
    Browser { name: "Safari".into(), visitors: 125 },
];
let html = Page::new("Traffic", Traffic { browsers }).child(chart).render();
assert!(html.contains(">400</span>"));
assert!(html.contains(r#"stroke-dasharray="68.750 31.250""#));

Implementations

impl<S: 'static, T: 'static> DonutChart<S, T>

pub fn new<U: Number + Textual + 'static>( label: impl Into<String>, rows: Sig<S, Vec<T>>, category: Sig<T, String>, value: Sig<T, U>, ) -> Self

A donut chart named label of rows, with slices of value labeled by category.

pub fn format(self, format: NumberFormat) -> Self

Writes the values and the total in format.

Until set, they are written as JavaScript’s String writes a number.

pub fn render(self) -> El<S>

The ring, its total, its legend, and the table a screen reader reads, in a <figure>.

Trait Implementations

impl<S, T> Debug for DonutChart<S, T>

fn fmt(&self, f: &mut Formatter<'_>) -> Result

Formats the value using the given formatter.

impl<S: 'static, T: 'static> From<DonutChart<S, T>> for El<S>

fn from(chart: DonutChart<S, T>) -> Self

Converts to this type from the input type.

impl<S: 'static, T: 'static> From<DonutChart<S, T>> for Node<S>

fn from(chart: DonutChart<S, T>) -> Self

Converts to this type from the input type.