From 6aaa87836cfc29c15b27dee4eeff4f1ddf120ef3 Mon Sep 17 00:00:00 2001 From: "opensearch-trigger-bot[bot]" <98922864+opensearch-trigger-bot[bot]@users.noreply.github.com> Date: Fri, 18 Oct 2024 13:53:55 -0700 Subject: [PATCH] Rotate x-Axis labels by 45 degree counter-wise to avoid common overlapping issue (#2211) (#2215) * updated release notes (#1997) * xaxis label default to rotate 45 angle * update snapshots * fix: Update getting started cards content and visual design (#2209) * updated release notes (#1997) * updated release notes (#1997) * update other snapshots --------- (cherry picked from commit d5853bcf0a8190c7317f1985bb78e99da1ee88fe) Signed-off-by: sumukhswamy Signed-off-by: Eric Signed-off-by: Viraj Sanghvi Signed-off-by: github-actions[bot] Co-authored-by: github-actions[bot] Co-authored-by: Sumukh Swamy Co-authored-by: Viraj Sanghvi --- common/constants/shared.ts | 2 +- .../__snapshots__/utils.test.tsx.snap | 42 +++--- .../__snapshots__/config_panel.test.tsx.snap | 130 +++++++++--------- .../__tests__/__snapshots__/bar.test.tsx.snap | 8 +- .../__snapshots__/heatmap.test.tsx.snap | 4 +- .../__snapshots__/histogram.test.tsx.snap | 4 +- .../horizontal_bar.test.tsx.snap | 8 +- .../__snapshots__/line.test.tsx.snap | 8 +- .../__tests__/__snapshots__/pie.test.tsx.snap | 4 +- .../__snapshots__/text.test.tsx.snap | 4 +- .../__snapshots__/treemap.test.tsx.snap | 4 +- 11 files changed, 109 insertions(+), 109 deletions(-) diff --git a/common/constants/shared.ts b/common/constants/shared.ts index 516fbce5d..53d7af48a 100644 --- a/common/constants/shared.ts +++ b/common/constants/shared.ts @@ -245,7 +245,7 @@ export const DEFAULT_CHART_STYLES: DefaultChartStylesProps = { MarkerSize: 5, ShowLegend: 'show', LegendPosition: 'v', - LabelAngle: 0, + LabelAngle: -45, DefaultSortSectors: 'largest_to_smallest', DefaultModeScatter: 'markers', }; diff --git a/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap b/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap index 0d5e2e56a..0cc3eec79 100644 --- a/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap +++ b/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap @@ -320,7 +320,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -419,7 +419,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -775,7 +775,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -874,7 +874,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -1253,7 +1253,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -1352,7 +1352,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -1467,7 +1467,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` "title": "", "xaxis": Object { "automargin": true, - "tickangle": 0, + "tickangle": -45, "tickfont": Object { "size": 12, }, @@ -1562,7 +1562,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` "title": "", "xaxis": Object { "automargin": true, - "tickangle": 0, + "tickangle": -45, "tickfont": Object { "size": 12, }, @@ -2000,7 +2000,7 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateLabels", "name": "Rotate labels", @@ -2516,7 +2516,7 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateLabels", "name": "Rotate labels", @@ -3086,7 +3086,7 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateLabels", "name": "Rotate labels", @@ -3296,7 +3296,7 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` "title": "", "xaxis": Object { "automargin": true, - "tickangle": 0, + "tickangle": -45, "tickfont": Object {}, }, "yaxis": Object { @@ -3403,7 +3403,7 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` "title": "", "xaxis": Object { "automargin": true, - "tickangle": 0, + "tickangle": -45, "tickfont": Object {}, }, "yaxis": Object { @@ -3757,7 +3757,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -3856,7 +3856,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` "icontype": "visBarHorizontalStacked", "id": "horizontal_bar", "label": "Horizontal bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -4212,7 +4212,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -4311,7 +4311,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` "icontype": "visBarHorizontalStacked", "id": "horizontal_bar", "label": "Horizontal bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -4690,7 +4690,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -4789,7 +4789,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` "icontype": "visBarHorizontalStacked", "id": "horizontal_bar", "label": "Horizontal bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -4910,7 +4910,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` }, "yaxis": Object { "automargin": true, - "tickangle": 0, + "tickangle": -45, "tickfont": Object { "size": 12, }, @@ -5005,7 +5005,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` }, "yaxis": Object { "automargin": true, - "tickangle": 0, + "tickangle": -45, "tickfont": Object { "size": 12, }, diff --git a/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap b/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap index 7e86aec61..146c08bb1 100644 --- a/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap +++ b/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap @@ -528,7 +528,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -627,7 +627,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -850,7 +850,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -950,7 +950,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -1155,7 +1155,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -1254,7 +1254,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarHorizontalStacked", "id": "horizontal_bar", "label": "Horizontal bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -1525,7 +1525,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateLabels", "name": "Rotate labels", @@ -2547,7 +2547,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -2647,7 +2647,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -2884,7 +2884,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -2984,7 +2984,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -3226,7 +3226,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -3327,7 +3327,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] icontype="visBarVerticalStacked" id="bar" key="vertical bar" - labelangle={0} + labelangle={-45} legendposition="v" linewidth={0} mode="group" @@ -3503,7 +3503,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -3603,7 +3603,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -3846,7 +3846,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -3946,7 +3946,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] iconType="visBarVerticalStacked" icontype="visBarVerticalStacked" id="bar" - labelangle={0} + labelangle={-45} legendposition="v" linewidth={0} mode="group" @@ -4159,7 +4159,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -4258,7 +4258,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] groupwidth={0.7} icontype="visBarVerticalStacked" id="bar" - labelangle={0} + labelangle={-45} legendposition="v" linewidth={0} mode="group" @@ -4648,7 +4648,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -5258,7 +5258,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -5357,7 +5357,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -5590,7 +5590,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -6200,7 +6200,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -6299,7 +6299,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -6573,7 +6573,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -7183,7 +7183,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -7282,7 +7282,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -7894,7 +7894,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -7993,7 +7993,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -8904,7 +8904,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -9003,7 +9003,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -10391,7 +10391,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -10490,7 +10490,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -11307,7 +11307,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -11909,7 +11909,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": [Function], - "defaultState": 0, + "defaultState": -45, "eleType": "slider", "mapTo": "rotateBarLabels", "name": "Rotate bar labels", @@ -12008,7 +12008,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] "icontype": "visBarVerticalStacked", "id": "bar", "label": "Vertical bar", - "labelangle": 0, + "labelangle": -45, "legendposition": "v", "linewidth": 0, "mode": "group", @@ -12483,7 +12483,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] />
@@ -13399,7 +13399,7 @@ exports[`Config panel component Renders config panel with visualization data 1`] name="Rotate bar labels" onChange={[Function]} step={1} - value={0} + value={-45} >