tk/spectre.console
1
0
Fork 0
mirror of https://github.com/nsnail/spectre.console.git synced 2025-06-19 05:18:16 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add documentation for Breakdown Chart (#1000)

Browse Source 
* Begin breakdown chart documentation
* Fix generator build failure
* Add in breakdown chart graphics
* Add breakdown chart documentation and move cast files
This commit is contained in:
Benjamin Michaelis
2022-10-06 13:02:25 -07:00
committed by GitHub
parent 7b23456d3e
commit db095217b7
7 changed files with 249 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
docs/input/assets/casts/breakdown-chart-plain.cast Normal file
View File

@ -0,0 +1,3 @@
{"version": 2, "width": 122, "height": 5, "title": "breakdown-chart (plain)", "env": {"TERM": "Spectre.Console"}}
[0, "o", "\u001B[31m\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u001B[0m\u001B[34m\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u001B[0m\u001B[32m\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u001B[0m\u001B[37m\u2588\u2588\u001B[0m\u001B[37m\u2588\u2588\u001B[0m\r\n\u001B[31m\u25A0\u001B[0m SCSS \u001B[37m80\u001B[0m \u001B[34m\u25A0\u001B[0m HTML \u001B[37m28.3\u001B[0m \u001B[32m\u25A0\u001B[0m C# \u001B[37m22.6\u001B[0m \u001B[37m\u25A0\u001B[0m JavaScript \u001B[37m6\u001B[0m \r\n\u001B[37m\u25A0\u001B[0m Ruby \u001B[37m6\u001B[0m \u001B[36m\u25A0\u001B[0m Shell \u001B[37m0.1\u001B[0m \r\n"]

3
docs/input/assets/casts/breakdown-chart-rich.cast Normal file
View File

@ -0,0 +1,3 @@
{"version": 2, "width": 122, "height": 5, "title": "breakdown-chart (rich)", "env": {"TERM": "Spectre.Console"}}
[0, "o", "\u001B[38;5;9m\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u001B[0m\u001B[38;5;12m\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u001B[0m\u001B[38;5;2m\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u001B[0m\u001B[38;5;11m\u2588\u2588\u001B[0m\u001B[38;5;119m\u2588\u2588\u001B[0m\r\n\u001B[38;5;9m\u25A0\u001B[0m SCSS \u001B[38;5;8m80\u001B[0m \u001B[38;5;12m\u25A0\u001B[0m HTML \u001B[38;5;8m28.3\u001B[0m \u001B[38;5;2m\u25A0\u001B[0m C# \u001B[38;5;8m22.6\u001B[0m \u001B[38;5;11m\u25A0\u001B[0m JavaScript \u001B[38;5;8m6\u001B[0m \r\n\u001B[38;5;119m\u25A0\u001B[0m Ruby \u001B[38;5;8m6\u001B[0m \u001B[38;5;14m\u25A0\u001B[0m Shell \u001B[38;5;8m0.1\u001B[0m \r\n"]

3
docs/input/widgets/barchart.md
View File

@ -6,14 +6,13 @@ Highlights:
- Labels
- Use your own data with a converter.
Reference: T:Spectre.Console.BarChart
---
Use `BarChart` to render bar charts to the console.
<?# AsciiCast cast="bar-chart" /?>
## Usage
### Basic usage

134
docs/input/widgets/breakdownchart.md Normal file
View File

@ -0,0 +1,134 @@
Title: Breakdown Chart
Order: 25
Description: "Use **BreakdownChart** to render breakdown charts to the console."
Highlights:
- Custom colors
- Labels
- Use your own data with a converter.
Reference: T:Spectre.Console.BreakdownChart
---
Use `BreakdownChart` to render breakdown charts to the console.
<?# AsciiCast cast="breakdown-chart" /?>
## Usage
### Basic usage
```csharp
AnsiConsole.Write(new BreakdownChart()
.Width(60)
// Add item is in the order of label, value, then color.
.AddItem("SCSS", 80, Color.Red)
.AddItem("HTML", 28.3, Color.Blue)
.AddItem("C#", 22.6, Color.Green)
.AddItem("JavaScript", 6, Color.Yellow)
.AddItem("Ruby", 6, Color.LightGreen)
.AddItem("Shell", 0.1, Color.Aqua));
```
### Additional Styling
```csharp
// Render chart at full width of console.
AnsiConsole.Write(new BreakdownChart()
.FullSize()
.AddItem("SCSS", 80, Color.Red)
.AddItem("HTML", 28.3, Color.Blue)
.AddItem("C#", 22.6, Color.Green)
.AddItem("JavaScript", 6, Color.Yellow)
.AddItem("Ruby", 6, Color.LightGreen)
.AddItem("Shell", 0.1, Color.Aqua));
```
```csharp
// Show percentage signs after the values in the chart.
AnsiConsole.Write(new BreakdownChart()
.ShowPercentage()
.AddItem("SCSS", 80, Color.Red)
.AddItem("HTML", 28.3, Color.Blue)
.AddItem("C#", 22.6, Color.Green)
.AddItem("JavaScript", 6, Color.Yellow)
.AddItem("Ruby", 6, Color.LightGreen)
.AddItem("Shell", 0.1, Color.Aqua));
```
```csharp
// Hide tags displaying in the chart altogether.
AnsiConsole.Write(new BreakdownChart()
.HideTag()
.AddItem("SCSS", 80, Color.Red)
.AddItem("HTML", 28.3, Color.Blue)
.AddItem("C#", 22.6, Color.Green)
.AddItem("JavaScript", 6, Color.Yellow)
.AddItem("Ruby", 6, Color.LightGreen)
.AddItem("Shell", 0.1, Color.Aqua));
```
```csharp
// Hide the values next to the tag from displaying in the chart.
AnsiConsole.Write(new BreakdownChart()
.HideTagValues()
.AddItem("SCSS", 80, Color.Red)
.AddItem("HTML", 28.3, Color.Blue)
.AddItem("C#", 22.6, Color.Green)
.AddItem("JavaScript", 6, Color.Yellow)
.AddItem("Ruby", 6, Color.LightGreen)
.AddItem("Shell", 0.1, Color.Aqua));
```
### Additional Functionality
#### Add items with converter
```csharp
// Create a list of fruits with their colors
var items = new List<(string Label, double Value, Color color)>
{
("Apple", 12, Color.Green),
("Orange", 54, Color.Orange1),
("Banana", 33, Color.Yellow),
};
// Render the chart
AnsiConsole.Write(new BreakdownChart()
.FullSize()
.ShowPercentage()
.AddItems(items, (item) => new BreakdownChartItem(
item.Label, item.Value, item.color)));
```
#### Add items implementing IBreakdownChartItem
```csharp
// Declare Fruit that implements IBreakdownChartItem
public sealed class Fruit : IBreakdownChartItem
{
public string Label { get; set; }
public double Value { get; set; }
public Color Color { get; set; }
public Fruit(string label, double value, Color color)
{
Label = label;
Value = value;
Color = color;
}
}
// Create a list of fruits
var items = new List<Fruit>
{
new Fruit("Apple", 12, Color.Green),
new Fruit("Orange", 54, Color.Orange1),
new Fruit("Banana", 33, Color.Yellow),
}
// Render chart
AnsiConsole.Write(new BreakdownChart()
.Width(60)
.AddItem(new Fruit("Mango", 3, Color.Orange4))
.AddItems(items));
```