update docs for chart colours

blshkv · Aug 13, 2022 · beba1c9 · beba1c9
1 parent f26fc08
commit beba1c9
Show file tree

Hide file tree

Showing 90 changed files with 44 additions and 6 deletions.
diff --git a/build-scripts/examples/07-chart.md b/build-scripts/examples/07-chart.md
@@ -10,10 +10,8 @@ The default metric is `alt`, with a default window of `5` minutes (2.5 mins arou
 The component used to be called 'gradient_chart', and type `gradient_chart` will still work, but is now deprecated and may be removed in 
 a future version.
 
-
 {{ <component type="gradient_chart" name="chart" /> }}
 
-
 ## Positioning
 
 use `x` and `y` to set the position of the chart
@@ -40,4 +38,15 @@ Use any standard metric, with any standard unit. See [04-metrics](../04-metrics)
 
 ## Colours / Sizing
 
-These attributes are not currently configurable.
+Set the height using `height`
+
+{{ <component type="chart" height="100" /> }}
+
+Set colours using `bg`, `fill`, `line` and `text`. These can be "r,g,b", or "r,g,b,a".
+
+{{ <component type="chart" bg="255,255,0" fill="0,255,255" line="255,0,255" text="0,0,255" /> }}
+
+Set alpha/transparency using `alpha`, between 0 and 255.
+
+{{ <component type="chart" alpha="20" /> }}
+{{ <component type="chart" alpha="200" /> }}
diff --git a/docs/xml/examples/01-simple-text/01-simple-text-0.png b/docs/xml/examples/01-simple-text/01-simple-text-0.png
diff --git a/docs/xml/examples/01-simple-text/01-simple-text-1.png b/docs/xml/examples/01-simple-text/01-simple-text-1.png
diff --git a/docs/xml/examples/01-simple-text/01-simple-text-2.png b/docs/xml/examples/01-simple-text/01-simple-text-2.png
diff --git a/docs/xml/examples/01-simple-text/01-simple-text-3.png b/docs/xml/examples/01-simple-text/01-simple-text-3.png
diff --git a/docs/xml/examples/01-simple-text/01-simple-text-4.png b/docs/xml/examples/01-simple-text/01-simple-text-4.png
diff --git a/docs/xml/examples/01-simple-text/01-simple-text-5.png b/docs/xml/examples/01-simple-text/01-simple-text-5.png
diff --git a/docs/xml/examples/01-simple-text/01-simple-text-6.png b/docs/xml/examples/01-simple-text/01-simple-text-6.png
diff --git a/docs/xml/examples/03-datetime/03-datetime-0.png b/docs/xml/examples/03-datetime/03-datetime-0.png
diff --git a/docs/xml/examples/03-datetime/03-datetime-1.png b/docs/xml/examples/03-datetime/03-datetime-1.png
diff --git a/docs/xml/examples/03-datetime/03-datetime-10.png b/docs/xml/examples/03-datetime/03-datetime-10.png
diff --git a/docs/xml/examples/03-datetime/03-datetime-2.png b/docs/xml/examples/03-datetime/03-datetime-2.png
diff --git a/docs/xml/examples/03-datetime/03-datetime-3.png b/docs/xml/examples/03-datetime/03-datetime-3.png
diff --git a/docs/xml/examples/03-datetime/03-datetime-4.png b/docs/xml/examples/03-datetime/03-datetime-4.png
diff --git a/docs/xml/examples/03-datetime/03-datetime-5.png b/docs/xml/examples/03-datetime/03-datetime-5.png
diff --git a/docs/xml/examples/03-datetime/03-datetime-6.png b/docs/xml/examples/03-datetime/03-datetime-6.png
diff --git a/docs/xml/examples/03-datetime/03-datetime-7.png b/docs/xml/examples/03-datetime/03-datetime-7.png
diff --git a/docs/xml/examples/03-datetime/03-datetime-8.png b/docs/xml/examples/03-datetime/03-datetime-8.png
diff --git a/docs/xml/examples/03-datetime/03-datetime-9.png b/docs/xml/examples/03-datetime/03-datetime-9.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-0.png b/docs/xml/examples/04-metrics/04-metrics-0.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-1.png b/docs/xml/examples/04-metrics/04-metrics-1.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-10.png b/docs/xml/examples/04-metrics/04-metrics-10.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-11.png b/docs/xml/examples/04-metrics/04-metrics-11.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-12.png b/docs/xml/examples/04-metrics/04-metrics-12.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-13.png b/docs/xml/examples/04-metrics/04-metrics-13.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-2.png b/docs/xml/examples/04-metrics/04-metrics-2.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-3.png b/docs/xml/examples/04-metrics/04-metrics-3.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-4.png b/docs/xml/examples/04-metrics/04-metrics-4.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-5.png b/docs/xml/examples/04-metrics/04-metrics-5.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-6.png b/docs/xml/examples/04-metrics/04-metrics-6.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-7.png b/docs/xml/examples/04-metrics/04-metrics-7.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-8.png b/docs/xml/examples/04-metrics/04-metrics-8.png
diff --git a/docs/xml/examples/04-metrics/04-metrics-9.png b/docs/xml/examples/04-metrics/04-metrics-9.png
diff --git a/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-0.png b/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-0.png
diff --git a/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-1.png b/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-1.png
diff --git a/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-2.png b/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-2.png
diff --git a/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-3.png b/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-3.png
diff --git a/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-4.png b/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-4.png
diff --git a/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-5.png b/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-5.png
diff --git a/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-6.png b/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-6.png
diff --git a/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-7.png b/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-7.png
diff --git a/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-8.png b/docs/xml/examples/07-air-speed-indicator/07-air-speed-indicator-8.png
diff --git a/docs/xml/examples/07-bar/07-bar-12.png b/docs/xml/examples/07-bar/07-bar-12.png
diff --git a/docs/xml/examples/07-chart/07-chart-0.png b/docs/xml/examples/07-chart/07-chart-0.png
diff --git a/docs/xml/examples/07-chart/07-chart-1.png b/docs/xml/examples/07-chart/07-chart-1.png
diff --git a/docs/xml/examples/07-chart/07-chart-10.png b/docs/xml/examples/07-chart/07-chart-10.png
diff --git a/docs/xml/examples/07-chart/07-chart-11.png b/docs/xml/examples/07-chart/07-chart-11.png
diff --git a/docs/xml/examples/07-chart/07-chart-2.png b/docs/xml/examples/07-chart/07-chart-2.png
diff --git a/docs/xml/examples/07-chart/07-chart-3.png b/docs/xml/examples/07-chart/07-chart-3.png
diff --git a/docs/xml/examples/07-chart/07-chart-4.png b/docs/xml/examples/07-chart/07-chart-4.png
diff --git a/docs/xml/examples/07-chart/07-chart-5.png b/docs/xml/examples/07-chart/07-chart-5.png
diff --git a/docs/xml/examples/07-chart/07-chart-6.png b/docs/xml/examples/07-chart/07-chart-6.png
diff --git a/docs/xml/examples/07-chart/07-chart-7.png b/docs/xml/examples/07-chart/07-chart-7.png
diff --git a/docs/xml/examples/07-chart/07-chart-8.png b/docs/xml/examples/07-chart/07-chart-8.png
diff --git a/docs/xml/examples/07-chart/07-chart-9.png b/docs/xml/examples/07-chart/07-chart-9.png
diff --git a/docs/xml/examples/07-chart/README.md b/docs/xml/examples/07-chart/README.md
@@ -21,14 +21,12 @@ The component used to be called 'gradient_chart', and type `gradient_chart` will
 a future version.
 
 
-
 ```xml
 <component type="gradient_chart" name="chart" />
 ```
 <kbd>![07-chart-1.png](07-chart-1.png)</kbd>
 
 
-
 ## Positioning
 
 use `x` and `y` to set the position of the chart
@@ -85,4 +83,35 @@ Use any standard metric, with any standard unit. See [04-metrics](../04-metrics)
 
 ## Colours / Sizing
 
-These attributes are not currently configurable.
+Set the height using `height`
+
+
+```xml
+<component type="chart" height="100" />
+```
+<kbd>![07-chart-8.png](07-chart-8.png)</kbd>
+
+
+Set colours using `bg`, `fill`, `line` and `text`. These can be "r,g,b", or "r,g,b,a".
+
+
+```xml
+<component type="chart" bg="255,255,0" fill="0,255,255" line="255,0,255" text="0,0,255" />
+```
+<kbd>![07-chart-9.png](07-chart-9.png)</kbd>
+
+
+Set alpha/transparency using `alpha`, between 0 and 255.
+
+
+```xml
+<component type="chart" alpha="20" />
+```
+<kbd>![07-chart-10.png](07-chart-10.png)</kbd>
+
+
+```xml
+<component type="chart" alpha="200" />
+```
+<kbd>![07-chart-11.png](07-chart-11.png)</kbd>
+
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-0.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-0.png
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-1.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-1.png
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-10.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-10.png
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-11.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-11.png
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-2.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-2.png
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-3.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-3.png
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-4.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-4.png
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-5.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-5.png
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-6.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-6.png
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-7.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-7.png
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-8.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-8.png
diff --git a/docs/xml/examples/07-compass-arrow/07-compass-arrow-9.png b/docs/xml/examples/07-compass-arrow/07-compass-arrow-9.png
diff --git a/docs/xml/examples/07-compass/07-compass-0.png b/docs/xml/examples/07-compass/07-compass-0.png
diff --git a/docs/xml/examples/07-compass/07-compass-2.png b/docs/xml/examples/07-compass/07-compass-2.png
diff --git a/docs/xml/examples/07-compass/07-compass-3.png b/docs/xml/examples/07-compass/07-compass-3.png
diff --git a/docs/xml/examples/07-compass/07-compass-4.png b/docs/xml/examples/07-compass/07-compass-4.png
diff --git a/docs/xml/examples/07-compass/07-compass-5.png b/docs/xml/examples/07-compass/07-compass-5.png
diff --git a/docs/xml/examples/07-compass/07-compass-6.png b/docs/xml/examples/07-compass/07-compass-6.png
diff --git a/docs/xml/examples/07-compass/07-compass-7.png b/docs/xml/examples/07-compass/07-compass-7.png
diff --git a/docs/xml/examples/07-compass/07-compass-8.png b/docs/xml/examples/07-compass/07-compass-8.png
diff --git a/docs/xml/examples/07-compass/07-compass-9.png b/docs/xml/examples/07-compass/07-compass-9.png
diff --git a/docs/xml/examples/08-translate/08-translate-0.png b/docs/xml/examples/08-translate/08-translate-0.png
diff --git a/docs/xml/examples/08-translate/08-translate-1.png b/docs/xml/examples/08-translate/08-translate-1.png
diff --git a/docs/xml/examples/08-translate/08-translate-2.png b/docs/xml/examples/08-translate/08-translate-2.png
diff --git a/docs/xml/examples/08-translate/08-translate-3.png b/docs/xml/examples/08-translate/08-translate-3.png
diff --git a/docs/xml/examples/08-translate/08-translate-4.png b/docs/xml/examples/08-translate/08-translate-4.png
diff --git a/docs/xml/examples/08-translate/08-translate-5.png b/docs/xml/examples/08-translate/08-translate-5.png
diff --git a/docs/xml/examples/09-frame/09-frame-0.png b/docs/xml/examples/09-frame/09-frame-0.png
diff --git a/docs/xml/examples/09-frame/09-frame-1.png b/docs/xml/examples/09-frame/09-frame-1.png
diff --git a/docs/xml/examples/09-frame/09-frame-2.png b/docs/xml/examples/09-frame/09-frame-2.png
diff --git a/docs/xml/examples/09-frame/09-frame-3.png b/docs/xml/examples/09-frame/09-frame-3.png
diff --git a/docs/xml/examples/09-frame/09-frame-4.png b/docs/xml/examples/09-frame/09-frame-4.png
diff --git a/docs/xml/examples/09-frame/09-frame-5.png b/docs/xml/examples/09-frame/09-frame-5.png
diff --git a/docs/xml/examples/09-frame/09-frame-6.png b/docs/xml/examples/09-frame/09-frame-6.png