tsai
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Add colour palette options for charts

pull/817/head
Andrew Kingston 6 years ago
parent
732685ec60
commit
31c083d5ba
6 changed files with 183 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 90
      packages/builder/src/components/userInterface/temporaryPanelStructure.js
  2. 80
      packages/standard-components/components.json
  3. 7
      packages/standard-components/src/Chart/ApexOptionsBuilder.js
  4. 2
      packages/standard-components/src/Chart/BarChart.svelte
  5. 2
      packages/standard-components/src/Chart/LineChart.svelte
  6. 2
      packages/standard-components/src/Chart/PieChart.svelte

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]))

Write Preview
Loading…
Cancel
Save