fix: add theme min radius to point shape (opensearch-project#996)

AMoo-Miki · Jan 29, 2021 · 98089a9 · 98089a9
1 parent 4f23b4f
commit 98089a9
Show file tree

Hide file tree

Showing 11 changed files with 6 additions and 9 deletions.
diff --git a/...ests-for-all-stories-bubble-chart-alpha-mixed-visually-looks-correct-1-snap.png b/...ests-for-all-stories-bubble-chart-alpha-mixed-visually-looks-correct-1-snap.png
diff --git a/...s-for-all-stories-bubble-chart-alpha-multiple-visually-looks-correct-1-snap.png b/...s-for-all-stories-bubble-chart-alpha-multiple-visually-looks-correct-1-snap.png
diff --git a/...ts-for-all-stories-bubble-chart-alpha-ordinal-visually-looks-correct-1-snap.png b/...ts-for-all-stories-bubble-chart-alpha-ordinal-visually-looks-correct-1-snap.png
diff --git a/...sts-for-all-stories-bubble-chart-alpha-simple-visually-looks-correct-1-snap.png b/...sts-for-all-stories-bubble-chart-alpha-simple-visually-looks-correct-1-snap.png
diff --git a/...ll-stories-line-chart-line-with-mark-accessor-visually-looks-correct-1-snap.png b/...ll-stories-line-chart-line-with-mark-accessor-visually-looks-correct-1-snap.png
diff --git a/...r-all-stories-mixed-charts-mark-size-accessor-visually-looks-correct-1-snap.png b/...r-all-stories-mixed-charts-mark-size-accessor-visually-looks-correct-1-snap.png
diff --git a/...ts-interactions-tooltip-formatting-should-use-custom-mark-formatters-1-snap.png b/...ts-interactions-tooltip-formatting-should-use-custom-mark-formatters-1-snap.png
diff --git a/packages/osd-charts/src/chart_types/xy_chart/rendering/area.ts b/packages/osd-charts/src/chart_types/xy_chart/rendering/area.ts
@@ -107,7 +107,6 @@ export function renderArea(
     yScale,
     panel,
     color,
-    seriesStyle.line,
     seriesStyle.point,
     hasY0Accessors,
     markSizeOptions,

diff --git a/packages/osd-charts/src/chart_types/xy_chart/rendering/bubble.ts b/packages/osd-charts/src/chart_types/xy_chart/rendering/bubble.ts
@@ -53,7 +53,6 @@ export function renderBubble(
     panel,
     color,
     seriesStyle.point,
-    seriesStyle.point,
     hasY0Accessors,
     markSizeOptions,
     pointStyleAccessor,

diff --git a/packages/osd-charts/src/chart_types/xy_chart/rendering/line.ts b/packages/osd-charts/src/chart_types/xy_chart/rendering/line.ts
@@ -74,7 +74,6 @@ export function renderLine(
     yScale,
     panel,
     color,
-    seriesStyle.line,
     seriesStyle.point,
     hasY0Accessors,
     markSizeOptions,

diff --git a/packages/osd-charts/src/chart_types/xy_chart/rendering/points.ts b/packages/osd-charts/src/chart_types/xy_chart/rendering/points.ts
@@ -20,7 +20,7 @@ import { Scale } from '../../../scales';
 import { Color, isNil } from '../../../utils/common';
 import { Dimensions } from '../../../utils/dimensions';
 import { BandedAccessorType, PointGeometry } from '../../../utils/geometry';
-import { LineStyle, PointStyle } from '../../../utils/themes/theme';
+import { PointStyle } from '../../../utils/themes/theme';
 import { GeometryType, IndexedGeometryMap } from '../utils/indexed_geometry_map';
 import { DataSeries, DataSeriesDatum, FilledValues, XYChartSeriesIdentifier } from '../utils/series';
 import { PointStyleAccessor, StackMode } from '../utils/specs';
@@ -35,8 +35,6 @@ import {
   YDefinedFn,
 } from './utils';
 
-const DEFAULT_RADIUS = 1;
-
 /** @internal */
 export function renderPoints(
   shift: number,
@@ -45,7 +43,6 @@ export function renderPoints(
   yScale: Scale,
   panel: Dimensions,
   color: Color,
-  lineStyle: LineStyle,
   pointStyle: PointStyle,
   hasY0Accessors: boolean,
   markSizeOptions: MarkSizeOptions,
@@ -113,11 +110,14 @@ export function renderPoints(
       const styleOverrides = getPointStyleOverrides(datum, seriesIdentifier, styleAccessor);
       const style = buildPointGeometryStyles(color, pointStyle, styleOverrides);
       const orphan = isOrphanDataPoint(dataIndex, dataSeries.data.length, yDefined, prev, next);
-      const radius = markSizeOptions.enabled ? getRadius(mark) : styleOverrides?.radius ?? pointStyle.radius;
+      // if radius is defined with the mark, limit the minimum radius to the theme radius value
+      const radius = markSizeOptions.enabled
+        ? Math.max(getRadius(mark), pointStyle.radius)
+        : styleOverrides?.radius ?? pointStyle.radius;
       const pointGeometry: PointGeometry = {
         x,
         y,
-        radius: Math.max(radius, DEFAULT_RADIUS),
+        radius,
         color,
         style,
         value: {