Add colour palette options for charts
This commit is contained in:
parent
2cf7f66d9b
commit
951f5e1db5
|
@ -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",
|
||||
|
|
|
@ -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"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
|
@ -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, "")
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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]))
|
||||
|
|
Loading…
Reference in New Issue