remove palette name
This commit is contained in:
parent
bad7a535dc
commit
1c14a71ef8
|
@ -1714,19 +1714,19 @@
|
|||
"type": "select",
|
||||
"label": "Colors",
|
||||
"key": "palette",
|
||||
"defaultValue": "palette1",
|
||||
"defaultValue": "Palette 1",
|
||||
"options": [
|
||||
{ "label": "Custom", "value": "Custom" },
|
||||
{ "label": "Palette 1", "value": "palette1" },
|
||||
{ "label": "Palette 2", "value": "palette2" },
|
||||
{ "label": "Palette 3", "value": "palette3" },
|
||||
{ "label": "Palette 4", "value": "palette4" },
|
||||
{ "label": "Palette 5", "value": "palette5" },
|
||||
{ "label": "Palette 6", "value": "palette6" },
|
||||
{ "label": "Palette 7", "value": "palette7" },
|
||||
{ "label": "Palette 8", "value": "palette8" },
|
||||
{ "label": "Palette 9", "value": "palette9" },
|
||||
{ "label": "Palette 10", "value": "palette10" }
|
||||
"Custom",
|
||||
"Palette 1",
|
||||
"Palette 2",
|
||||
"Palette 3",
|
||||
"Palette 4",
|
||||
"Palette 5",
|
||||
"Palette 6",
|
||||
"Palette 7",
|
||||
"Palette 8",
|
||||
"Palette 9",
|
||||
"Palette 10"
|
||||
]
|
||||
},
|
||||
{
|
||||
|
@ -1883,19 +1883,19 @@
|
|||
"type": "select",
|
||||
"label": "Colors",
|
||||
"key": "palette",
|
||||
"defaultValue": "palette1",
|
||||
"defaultValue": "Palette 1",
|
||||
"options": [
|
||||
{ "label": "Custom", "value": "Custom" },
|
||||
{ "label": "Palette 1", "value": "palette1" },
|
||||
{ "label": "Palette 2", "value": "palette2" },
|
||||
{ "label": "Palette 3", "value": "palette3" },
|
||||
{ "label": "Palette 4", "value": "palette4" },
|
||||
{ "label": "Palette 5", "value": "palette5" },
|
||||
{ "label": "Palette 6", "value": "palette6" },
|
||||
{ "label": "Palette 7", "value": "palette7" },
|
||||
{ "label": "Palette 8", "value": "palette8" },
|
||||
{ "label": "Palette 9", "value": "palette9" },
|
||||
{ "label": "Palette 10", "value": "palette10" }
|
||||
"Custom",
|
||||
"Palette 1",
|
||||
"Palette 2",
|
||||
"Palette 3",
|
||||
"Palette 4",
|
||||
"Palette 5",
|
||||
"Palette 6",
|
||||
"Palette 7",
|
||||
"Palette 8",
|
||||
"Palette 9",
|
||||
"Palette 10"
|
||||
]
|
||||
},
|
||||
{
|
||||
|
@ -2047,19 +2047,19 @@
|
|||
"type": "select",
|
||||
"label": "Colors",
|
||||
"key": "palette",
|
||||
"defaultValue": "palette1",
|
||||
"defaultValue": "Palette 1",
|
||||
"options": [
|
||||
{ "label": "Custom", "value": "Custom" },
|
||||
{ "label": "Palette 1", "value": "palette1" },
|
||||
{ "label": "Palette 2", "value": "palette2" },
|
||||
{ "label": "Palette 3", "value": "palette3" },
|
||||
{ "label": "Palette 4", "value": "palette4" },
|
||||
{ "label": "Palette 5", "value": "palette5" },
|
||||
{ "label": "Palette 6", "value": "palette6" },
|
||||
{ "label": "Palette 7", "value": "palette7" },
|
||||
{ "label": "Palette 8", "value": "palette8" },
|
||||
{ "label": "Palette 9", "value": "palette9" },
|
||||
{ "label": "Palette 10", "value": "palette10" }
|
||||
"Custom",
|
||||
"Palette 1",
|
||||
"Palette 2",
|
||||
"Palette 3",
|
||||
"Palette 4",
|
||||
"Palette 5",
|
||||
"Palette 6",
|
||||
"Palette 7",
|
||||
"Palette 8",
|
||||
"Palette 9",
|
||||
"Palette 10"
|
||||
]
|
||||
},
|
||||
{
|
||||
|
@ -2206,19 +2206,19 @@
|
|||
"type": "select",
|
||||
"label": "Colors",
|
||||
"key": "palette",
|
||||
"defaultValue": "palette1",
|
||||
"defaultValue": "Palette 1",
|
||||
"options": [
|
||||
{ "label": "Custom", "value": "Custom" },
|
||||
{ "label": "Palette 1", "value": "palette1" },
|
||||
{ "label": "Palette 2", "value": "palette2" },
|
||||
{ "label": "Palette 3", "value": "palette3" },
|
||||
{ "label": "Palette 4", "value": "palette4" },
|
||||
{ "label": "Palette 5", "value": "palette5" },
|
||||
{ "label": "Palette 6", "value": "palette6" },
|
||||
{ "label": "Palette 7", "value": "palette7" },
|
||||
{ "label": "Palette 8", "value": "palette8" },
|
||||
{ "label": "Palette 9", "value": "palette9" },
|
||||
{ "label": "Palette 10", "value": "palette10" }
|
||||
"Custom",
|
||||
"Palette 1",
|
||||
"Palette 2",
|
||||
"Palette 3",
|
||||
"Palette 4",
|
||||
"Palette 5",
|
||||
"Palette 6",
|
||||
"Palette 7",
|
||||
"Palette 8",
|
||||
"Palette 9",
|
||||
"Palette 10"
|
||||
]
|
||||
},
|
||||
{
|
||||
|
@ -2346,19 +2346,19 @@
|
|||
"type": "select",
|
||||
"label": "Colors",
|
||||
"key": "palette",
|
||||
"defaultValue": "palette1",
|
||||
"defaultValue": "Palette 1",
|
||||
"options": [
|
||||
{ "label": "Custom", "value": "Custom" },
|
||||
{ "label": "Palette 1", "value": "palette1" },
|
||||
{ "label": "Palette 2", "value": "palette2" },
|
||||
{ "label": "Palette 3", "value": "palette3" },
|
||||
{ "label": "Palette 4", "value": "palette4" },
|
||||
{ "label": "Palette 5", "value": "palette5" },
|
||||
{ "label": "Palette 6", "value": "palette6" },
|
||||
{ "label": "Palette 7", "value": "palette7" },
|
||||
{ "label": "Palette 8", "value": "palette8" },
|
||||
{ "label": "Palette 9", "value": "palette9" },
|
||||
{ "label": "Palette 10", "value": "palette10" }
|
||||
"Custom",
|
||||
"Palette 1",
|
||||
"Palette 2",
|
||||
"Palette 3",
|
||||
"Palette 4",
|
||||
"Palette 5",
|
||||
"Palette 6",
|
||||
"Palette 7",
|
||||
"Palette 8",
|
||||
"Palette 9",
|
||||
"Palette 10"
|
||||
]
|
||||
},
|
||||
{
|
||||
|
@ -2615,19 +2615,19 @@
|
|||
"type": "select",
|
||||
"label": "Colors",
|
||||
"key": "palette",
|
||||
"defaultValue": "palette1",
|
||||
"defaultValue": "Palette 1",
|
||||
"options": [
|
||||
{ "label": "Custom", "value": "Custom" },
|
||||
{ "label": "Palette 1", "value": "palette1" },
|
||||
{ "label": "Palette 2", "value": "palette2" },
|
||||
{ "label": "Palette 3", "value": "palette3" },
|
||||
{ "label": "Palette 4", "value": "palette4" },
|
||||
{ "label": "Palette 5", "value": "palette5" },
|
||||
{ "label": "Palette 6", "value": "palette6" },
|
||||
{ "label": "Palette 7", "value": "palette7" },
|
||||
{ "label": "Palette 8", "value": "palette8" },
|
||||
{ "label": "Palette 9", "value": "palette9" },
|
||||
{ "label": "Palette 10", "value": "palette10" }
|
||||
"Custom",
|
||||
"Palette 1",
|
||||
"Palette 2",
|
||||
"Palette 3",
|
||||
"Palette 4",
|
||||
"Palette 5",
|
||||
"Palette 6",
|
||||
"Palette 7",
|
||||
"Palette 8",
|
||||
"Palette 9",
|
||||
"Palette 10"
|
||||
]
|
||||
},
|
||||
{
|
||||
|
@ -5292,19 +5292,19 @@
|
|||
"type": "select",
|
||||
"label": "Colors",
|
||||
"key": "palette",
|
||||
"defaultValue": "palette1",
|
||||
"defaultValue": "Palette 1",
|
||||
"options": [
|
||||
{ "label": "Custom", "value": "Custom" },
|
||||
{ "label": "Palette 1", "value": "palette1" },
|
||||
{ "label": "Palette 2", "value": "palette2" },
|
||||
{ "label": "Palette 3", "value": "palette3" },
|
||||
{ "label": "Palette 4", "value": "palette4" },
|
||||
{ "label": "Palette 5", "value": "palette5" },
|
||||
{ "label": "Palette 6", "value": "palette6" },
|
||||
{ "label": "Palette 7", "value": "palette7" },
|
||||
{ "label": "Palette 8", "value": "palette8" },
|
||||
{ "label": "Palette 9", "value": "palette9" },
|
||||
{ "label": "Palette 10", "value": "palette10" }
|
||||
"Custom",
|
||||
"Palette 1",
|
||||
"Palette 2",
|
||||
"Palette 3",
|
||||
"Palette 4",
|
||||
"Palette 5",
|
||||
"Palette 6",
|
||||
"Palette 7",
|
||||
"Palette 8",
|
||||
"Palette 9",
|
||||
"Palette 10"
|
||||
]
|
||||
},
|
||||
{
|
||||
|
|
|
@ -11,7 +11,6 @@
|
|||
|
||||
// Apex charts directly modifies the options object with default properties and internal variables. These being present could unintentionally cause issues to the provider of this prop as the changes are reflected in that component as well. To prevent any issues we clone options here to provide a buffer.
|
||||
$: optionsCopy = cloneDeep(options)
|
||||
$: console.log(options, optionsCopy)
|
||||
|
||||
let chartElement
|
||||
let chart
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<script>
|
||||
import ApexChart from "./ApexChart.svelte"
|
||||
import { formatters } from "./utils"
|
||||
import { formatters, parsePalette } from "./utils"
|
||||
|
||||
export let title
|
||||
export let dataProvider
|
||||
|
@ -41,7 +41,7 @@
|
|||
},
|
||||
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
|
||||
theme: {
|
||||
palette: palette === "Custom" ? null : palette,
|
||||
palette: parsePalette(palette),
|
||||
},
|
||||
fill,
|
||||
legend: {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<script>
|
||||
import ApexChart from "./ApexChart.svelte"
|
||||
import { formatters } from "./utils"
|
||||
import { formatters, parsePalette } from "./utils"
|
||||
|
||||
export let dataProvider
|
||||
export let labelColumn
|
||||
|
@ -34,7 +34,7 @@
|
|||
series,
|
||||
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
|
||||
theme: {
|
||||
palette: palette === "Custom" ? null : palette,
|
||||
palette: parsePalette(palette),
|
||||
},
|
||||
legend: {
|
||||
show: legend,
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<script>
|
||||
import ApexChart from "./ApexChart.svelte"
|
||||
import { formatters } from "./utils"
|
||||
import { formatters, parsePalette } from "./utils"
|
||||
|
||||
export let title
|
||||
export let dataProvider
|
||||
|
@ -26,7 +26,7 @@
|
|||
labels,
|
||||
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
|
||||
theme: {
|
||||
palette: palette === "Custom" ? null : palette,
|
||||
palette: parsePalette(palette),
|
||||
},
|
||||
legend: {
|
||||
show: legend,
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
<script>
|
||||
import ApexChart from "./ApexChart.svelte"
|
||||
import { parsePalette } from "./utils"
|
||||
|
||||
export let dataProvider
|
||||
export let valueColumn
|
||||
|
@ -25,7 +26,7 @@
|
|||
series,
|
||||
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
|
||||
theme: {
|
||||
palette: palette === "Custom" ? null : palette,
|
||||
palette: parsePalette(palette),
|
||||
},
|
||||
title: {
|
||||
text: title,
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<script>
|
||||
import ApexChart from "./ApexChart.svelte"
|
||||
import { formatters } from "./utils"
|
||||
import { formatters, parsePalette } from "./utils"
|
||||
|
||||
export let title
|
||||
export let dataProvider
|
||||
|
@ -35,7 +35,7 @@
|
|||
},
|
||||
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
|
||||
theme: {
|
||||
palette: palette === "Custom" ? null : palette,
|
||||
palette: parsePalette(palette),
|
||||
},
|
||||
legend: {
|
||||
show: legend,
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<script>
|
||||
import ApexChart from "./ApexChart.svelte"
|
||||
import { formatters } from "./utils"
|
||||
import { formatters, parsePalette } from "./utils"
|
||||
|
||||
export let title
|
||||
export let dataProvider
|
||||
|
@ -26,7 +26,7 @@
|
|||
labels,
|
||||
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
|
||||
theme: {
|
||||
palette: palette === "Custom" ? null : palette,
|
||||
palette: parsePalette(palette),
|
||||
},
|
||||
legend: {
|
||||
show: legend,
|
||||
|
|
|
@ -5,6 +5,17 @@ export const formatters = {
|
|||
["Datetime"]: val => new Date(val).toLocaleString(),
|
||||
}
|
||||
|
||||
export const parsePalette = (paletteName) => {
|
||||
if (paletteName === "Custom") {
|
||||
// return null in this case so that the palette option doesn't get consumed by Apex Charts
|
||||
return null;
|
||||
}
|
||||
|
||||
const [_, number] = paletteName.split(" ");
|
||||
|
||||
return `pallete${number}`
|
||||
}
|
||||
|
||||
// Deep clone which copies function references
|
||||
export const cloneDeep = (value) => {
|
||||
const typesToNaiveCopy = ["string", "boolean", "number", "function", "symbol"]
|
||||
|
|
Loading…
Reference in New Issue