diff --git a/packages/client/manifest.json b/packages/client/manifest.json index ac6de1ba39..19b4ef8040 100644 --- a/packages/client/manifest.json +++ b/packages/client/manifest.json @@ -1632,10 +1632,11 @@ }, { "type": "select", - "label": "Colours", + "label": "Colors", "key": "palette", "defaultValue": "Palette 1", "options": [ + "Custom", "Palette 1", "Palette 2", "Palette 3", @@ -1648,6 +1649,56 @@ "Palette 10" ] }, + { + "type": "color", + "label": "C1", + "key": "c1", + "barSeparator": false, + "dependsOn": { + "setting": "palette", + "value": "Custom" + } + }, + { + "type": "color", + "label": "C2", + "key": "c2", + "barSeparator": false, + "dependsOn": { + "setting": "palette", + "value": "Custom" + } + }, + { + "type": "color", + "label": "C3", + "key": "c3", + "barSeparator": false, + "dependsOn": { + "setting": "palette", + "value": "Custom" + } + }, + { + "type": "color", + "label": "C4", + "key": "c4", + "barSeparator": false, + "dependsOn": { + "setting": "palette", + "value": "Custom" + } + }, + { + "type": "color", + "label": "C5", + "key": "c5", + "barSeparator": false, + "dependsOn": { + "setting": "palette", + "value": "Custom" + } + }, { "type": "select", "label": "Curve", diff --git a/packages/client/src/components/app/charts/LineChart.svelte b/packages/client/src/components/app/charts/LineChart.svelte index afb9f14262..7f82a833d2 100644 --- a/packages/client/src/components/app/charts/LineChart.svelte +++ b/packages/client/src/components/app/charts/LineChart.svelte @@ -17,6 +17,7 @@ export let legend export let yAxisUnits export let palette + export let c1, c2, c3, c4, c5 // Area specific props export let area @@ -40,9 +41,13 @@ palette, area, stacked, - gradient + gradient, + c1 && c2 && c3 && c4 && c5 ? [c1, c2, c3, c4, c5] : null, + customColor ) + $: customColor = palette === "Custom" + const setUpChart = ( title, dataProvider, @@ -60,7 +65,9 @@ palette, area, stacked, - gradient + gradient, + colors, + customColor ) => { const allCols = [labelColumn, ...(valueColumns || [null])] if ( @@ -96,6 +103,7 @@ .legend(legend) .yUnits(yAxisUnits) .palette(palette) + .colors(customColor ? colors : null) // Add data let useDates = false