diff --git a/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_filters_Dark_Theme_Date_Filter_Quarter_Year_Dropdown.png b/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_filters_Dark_Theme_Date_Filter_Quarter_Year_Dropdown.png index 3883f48de71ca8298d53d96d0b34f9a5124dd040..4c6abc129e36302394a21da3ea1907b545b1e39b 100644 Binary files a/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_filters_Dark_Theme_Date_Filter_Quarter_Year_Dropdown.png and b/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_filters_Dark_Theme_Date_Filter_Quarter_Year_Dropdown.png differ diff --git a/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_filters_Dark_Theme_Number.png b/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_filters_Dark_Theme_Number.png index 1fead004731791636f92c22276cd6e63ffb9ffca..1214fa5e39165f256383040ca50bd119ff1c1601 100644 Binary files a/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_filters_Dark_Theme_Number.png and b/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_filters_Dark_Theme_Number.png differ diff --git a/.loki/reference/chrome_laptop_static_viz_PieChart_Labels_With_Percent.png b/.loki/reference/chrome_laptop_static_viz_PieChart_Labels_With_Percent.png index 4bcbcd99d4a3f51ec07602bbd4863d48d3d85c12..18ca98a820efe86e5df2444d7ff2cf4e7aef5216 100644 Binary files a/.loki/reference/chrome_laptop_static_viz_PieChart_Labels_With_Percent.png and b/.loki/reference/chrome_laptop_static_viz_PieChart_Labels_With_Percent.png differ diff --git a/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings.png b/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings.png index 63634fcdef688d8c81057c5eae18e3b50468ff2e..dc532513310e02b50f88df246a9cb53bbf2cc4e7 100644 Binary files a/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings.png and b/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings.png differ diff --git a/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_No_Labels.png b/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_No_Labels.png index 599785fb3b0ea13ae42e3958da51bac0c33b449d..9bbceecb4ee2ec9efa4b948cf87c7cdef9511f32 100644 Binary files a/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_No_Labels.png and b/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_No_Labels.png differ diff --git a/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Other_Slices.png b/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Other_Slices.png index 3a01115caf83fd4d518b209da08872964c55176b..d21447d358ca4ea95f6e0c2e6089ce6268533d8c 100644 Binary files a/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Other_Slices.png and b/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Other_Slices.png differ diff --git a/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Percentages_And_Labels.png b/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Percentages_And_Labels.png index b028ae28d453f68872133c0dc664e2b44034ca10..53988e1c5906c7d853901e811bedd30a8c632b58 100644 Binary files a/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Percentages_And_Labels.png and b/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Percentages_And_Labels.png differ diff --git a/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Percentages_On_Chart.png b/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Percentages_On_Chart.png index 7c5844843021960b9400f7902f10a22ced804c3d..a18dcd62ef641c857d86276076cd9184f9d01440 100644 Binary files a/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Percentages_On_Chart.png and b/.loki/reference/chrome_laptop_static_viz_PieChart_Three_Rings_Percentages_On_Chart.png differ diff --git a/.loki/reference/chrome_laptop_static_viz_PieChart_Two_Rings.png b/.loki/reference/chrome_laptop_static_viz_PieChart_Two_Rings.png index b96858ff484e99a7574cb90ee9e8617af948d4b5..a6031838c38bfb3358290a2c44231c5e8d5b7302 100644 Binary files a/.loki/reference/chrome_laptop_static_viz_PieChart_Two_Rings.png and b/.loki/reference/chrome_laptop_static_viz_PieChart_Two_Rings.png differ diff --git a/frontend/src/metabase/visualizations/echarts/pie/option.ts b/frontend/src/metabase/visualizations/echarts/pie/option.ts index a516e70cae505f0793a050811f1195432b0ff684..ae73bbedd6cc626bc115ba0fd8b4b5117331f97b 100644 --- a/frontend/src/metabase/visualizations/echarts/pie/option.ts +++ b/frontend/src/metabase/visualizations/echarts/pie/option.ts @@ -236,14 +236,6 @@ function getSeriesDataFromSlices( return []; } - let ringBorderWidth = borderWidth; - if (ring === 2) { - ringBorderWidth = DIMENSIONS.slice.twoRingBorderWidth; - } - if (ring === 3) { - ringBorderWidth = DIMENSIONS.slice.threeRingBorderWidth; - } - return slices.map(s => { const labelColor = getTextColorForBackground( s.color, @@ -272,11 +264,11 @@ function getSeriesDataFromSlices( : undefined, value: s.value, name, - itemStyle: { color: s.color, borderWidth: ringBorderWidth }, + itemStyle: { color: s.color, borderWidth }, label: { color: labelColor, formatter: () => (isLabelVisible ? label : " "), - rotate: ring === 1 ? 0 : "radial", + rotate: chartModel.numRings === 1 ? 0 : "radial", }, emphasis: { itemStyle: { @@ -308,6 +300,14 @@ function getSeriesDataFromSlices( ); } +const getBorderWidth = (innerSideLength: number, ringsCount = 1) => { + if (ringsCount === 1) { + // arc length formula: s = 2πr(θ/360°), we want border to be 1 degree + return (Math.PI * innerSideLength) / DIMENSIONS.slice.borderProportion; + } + return 1; +}; + export function getPieChartOption( chartModel: PieChartModel, formatters: PieChartFormatters, @@ -327,8 +327,7 @@ export function getPieChartOption( chartModel, ); - const borderWidth = - (Math.PI * innerSideLength) / DIMENSIONS.slice.borderProportion; // arc length formula: s = 2πr(θ/360°), we want border to be 1 degree + const borderWidth = getBorderWidth(innerSideLength, chartModel.numRings); const fontSize = chartModel.numRings > 1