CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-06-30 20:10:54 +12:00
Code Issues Projects Releases Wiki Activity

Add colour palette options for charts

Browse source
This commit is contained in:
Andrew Kingston 2020-11-05 13:37:28 +00:00
parent 732685ec60
commit 31c083d5ba
6 changed files with 183 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

90
packages/builder/src/components/userInterface/temporaryPanelStructure.js
View file

@ -480,6 +480,24 @@ export default {
control: Input,
defaultValue: "400",
},
{
label: "Colours",
key: "palette",
control: OptionSelect,
defaultValue: "Palette 1",
options: [
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10",
],
},
{
label: "Stacked",
key: "stacked",
@ -575,6 +593,24 @@ export default {
options: ["Smooth", "Straight", "Stepline"],
defaultValue: "Smooth",
},
{
label: "Colours",
key: "palette",
control: OptionSelect,
defaultValue: "Palette 1",
options: [
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10",
],
},
{
label: "Data Labels",
key: "dataLabels",
@ -663,6 +699,24 @@ export default {
options: ["Smooth", "Straight", "Stepline"],
defaultValue: "Smooth",
},
{
label: "Colours",
key: "palette",
control: OptionSelect,
defaultValue: "Palette 1",
options: [
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10",
],
},
{
label: "Data Labels",
key: "dataLabels",
@ -741,6 +795,24 @@ export default {
control: Input,
defaultValue: "200",
},
{
label: "Colours",
key: "palette",
control: OptionSelect,
defaultValue: "Palette 1",
options: [
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10",
],
},
{
label: "Data Labels",
key: "dataLabels",
@ -805,6 +877,24 @@ export default {
control: Input,
defaultValue: "200",
},
{
label: "Colours",
key: "palette",
control: OptionSelect,
defaultValue: "Palette 1",
options: [
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10",
],
},
{
label: "Data Labels",
key: "dataLabels",

80
packages/standard-components/components.json
View file

@ -424,6 +424,22 @@
"options": [
"Default", "Thousands", "Millions"
]
},
"palette": {
"type": "options",
"default": "Palette 1",
"options": [
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
}
}
},
@ -466,6 +482,22 @@
"options": [
"Default", "Thousands", "Millions"
]
},
"palette": {
"type": "options",
"default": "Palette 1",
"options": [
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
}
}
},
@ -513,6 +545,22 @@
"options": [
"Default", "Thousands", "Millions"
]
},
"palette": {
"type": "options",
"default": "Palette 1",
"options": [
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
}
}
},
@ -537,6 +585,22 @@
"legend": {
"type": "bool",
"default": true
},
"palette": {
"type": "options",
"default": "Palette 1",
"options": [
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
}
}
},
@ -561,6 +625,22 @@
"legend": {
"type": "bool",
"default": true
},
"palette": {
"type": "options",
"default": "Palette 1",
"options": [
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
}
}
},

7
packages/standard-components/src/Chart/ApexOptionsBuilder.js
View file

@ -144,4 +144,11 @@ export class ApexOptionsBuilder {
yTooltip(yTooltip) {
return this.setOption(["yaxis", "tooltip", "enabled"], yTooltip)
}
palette(palette) {
return this.setOption(
["theme", "palette"],
palette.toLowerCase().replace(/[\W]/g, "")
)
}
}

2
packages/standard-components/src/Chart/BarChart.svelte
View file

@ -27,6 +27,7 @@
export let legend
export let stacked
export let yAxisUnits
export let palette
const store = _bb.store
let options
@ -66,6 +67,7 @@
.legend(legend)
.stacked(stacked)
.yUnits(yAxisUnits)
.palette(palette)
// Add data
let useDates = false

2
packages/standard-components/src/Chart/LineChart.svelte
View file

@ -21,6 +21,7 @@
export let curve
export let legend
export let yAxisUnits
export let palette
// Area specific props
export let area
@ -67,6 +68,7 @@
.stacked(stacked)
.legend(legend)
.yUnits(yAxisUnits)
.palette(palette)
// Add data
let useDates = false

2
packages/standard-components/src/Chart/PieChart.svelte
View file

@ -17,6 +17,7 @@
export let animate
export let legend
export let donut
export let palette
const store = _bb.store
let options
@ -50,6 +51,7 @@
.animate(animate)
.legend(legend)
.legendPosition("right")
.palette(palette)
// Add data if valid datasource
const series = data.map(row => parseFloat(row[valueColumn]))