diff --git a/docs/modules/ROOT/pages/user-guide/reports/sunburst.adoc b/docs/modules/ROOT/pages/user-guide/reports/sunburst.adoc index c442baf21..8538dfe51 100644 --- a/docs/modules/ROOT/pages/user-guide/reports/sunburst.adoc +++ b/docs/modules/ROOT/pages/user-guide/reports/sunburst.adoc @@ -55,6 +55,10 @@ an arc needed to display a label (if labels are enabled). |Slice Corner Radius |number |3 |The rounding angle of each of the arcs in the visualization. +|Inherit color from parent |on/off |on |If enabled, starting from level 2, each +level will inherit the same color of his parent. If disabled, color will be randomly +assigned based on the color scheme. + |Auto-run query |on/off |on |When activated, automatically runs the query when the report is displayed. When set to `off', the query is displayed and will need to be executed manually. diff --git a/src/chart/sunburst/SunburstChart.tsx b/src/chart/sunburst/SunburstChart.tsx index 36c91486d..75fe39949 100644 --- a/src/chart/sunburst/SunburstChart.tsx +++ b/src/chart/sunburst/SunburstChart.tsx @@ -14,7 +14,6 @@ const NeoSunburstChart = (props: ChartProps) => { } const records = props.records; const selection = props.selection; - const [data, setData] = useState(undefined); useEffect(() => { setData(commonProperties.data); }, [props.selection]); @@ -32,10 +31,15 @@ const NeoSunburstChart = (props: ChartProps) => { // Where a user give us just the tree starting one hop away from the root. // as Nivo needs a common root, so in that case, we create it for them. const commonProperties = { data: dataPre.length == 1 ? dataPre[0] : { name: "Total", children: dataPre } }; + + const [data, setData] = useState(commonProperties.data); + if(data == undefined){ setData(commonProperties.data); } + + const [back, setBack] = useState(false); const settings = (props.settings) ? props.settings : {}; const legendHeight = 20; const marginRight = (settings["marginRight"]) ? settings["marginRight"] : 24; @@ -45,10 +49,11 @@ const NeoSunburstChart = (props: ChartProps) => { const enableArcLabels = (settings["enableArcLabels"] !== undefined) ? settings["enableArcLabels"] : true; const interactive = (settings["interactive"]) ? settings["interactive"] : true; const borderWidth = (settings["borderWidth"]) ? settings["borderWidth"] : 0; - const legend = (settings["legend"]) ? settings["legend"] : false; + const legend = (settings["legend"] !== undefined) ? settings["legend"] : false; const arcLabelsSkipAngle = (settings["arcLabelsSkipAngle"]) ? settings["arcLabelsSkipAngle"] : 10; const cornerRadius = (settings["cornerRadius"]) ? settings["cornerRadius"] : 3; const colorScheme = (settings["colors"]) ? settings["colors"] : 'nivo'; + const inheritColorFromParent = (settings["inheritColorFromParent"] !== undefined) ? settings["inheritColorFromParent"] : true; if(!data || !data.children || data.children.length == 0){ return ; @@ -80,6 +85,7 @@ const NeoSunburstChart = (props: ChartProps) => { enableArcLabels={enableArcLabels} borderWidth={borderWidth} cornerRadius={cornerRadius} + inheritColorFromParent = {inheritColorFromParent} margin={{ top: marginTop, right: marginRight, diff --git a/src/config/ReportConfig.tsx b/src/config/ReportConfig.tsx index 4b8244ef0..788c2ec07 100644 --- a/src/config/ReportConfig.tsx +++ b/src/config/ReportConfig.tsx @@ -951,6 +951,12 @@ export const REPORT_TYPES = { type: SELECTION_TYPES.NUMBER, default: 3 }, + "inheritColorFromParent": { + label: "Inherit color from parent", + type: SELECTION_TYPES.LIST, + values: [true, false], + default: true + }, "autorun": { label: "Auto-run query", type: SELECTION_TYPES.LIST,