Update dependency @elastic/charts to v30 (master) (elastic#101409)

Co-authored-by: Renovate Bot <bot@renovateapp.com> Co-authored-by: nickofthyme <nick.ryan.partridge@gmail.com> Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Marco Vettorello <vettorello.marco@gmail.com>
markov00 · Jun 8, 2021 · c8cde17 · c8cde17
1 parent c48f2fd
commit c8cde17
Show file tree

Hide file tree

Showing 12 changed files with 27 additions and 22 deletions.
diff --git a/package.json b/package.json
@@ -96,7 +96,7 @@
   "dependencies": {
     "@elastic/apm-rum": "^5.6.1",
     "@elastic/apm-rum-react": "^1.2.5",
-    "@elastic/charts": "29.2.0",
+    "@elastic/charts": "30.0.0",
     "@elastic/datemath": "link:bazel-bin/packages/elastic-datemath",
     "@elastic/elasticsearch": "npm:@elastic/elasticsearch-canary@7.13.0-canary.1",
     "@elastic/ems-client": "7.13.0",

diff --git a/src/plugins/vis_type_xy/public/config/get_axis.ts b/src/plugins/vis_type_xy/public/config/get_axis.ts
@@ -169,7 +169,7 @@ function getAxisDomain<S extends XScaleType | YScaleType>(
 
   const { min, max, defaultYExtents, boundsMargin } = scale;
   const fit = defaultYExtents;
-  const padding = boundsMargin;
+  const padding = boundsMargin || undefined;
 
   if (!isNil(min) && !isNil(max)) {
     return { fit, padding, min, max };

diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/timeline/timeline.tsx b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/timeline/timeline.tsx
@@ -19,6 +19,7 @@ import {
   TooltipValue,
   niceTimeFormatter,
   ElementClickListener,
+  GeometryValue,
   RectAnnotation,
   RectAnnotationDatum,
 } from '@elastic/charts';
@@ -141,7 +142,8 @@ export const Timeline: React.FC<Props> = ({ interval, yAxisFormatter, isVisible
   const onClickPoint: ElementClickListener = useCallback(
     ([[geometryValue]]) => {
       if (!Array.isArray(geometryValue)) {
-        const { x: timestamp } = geometryValue;
+        // casting to GeometryValue as we are using cartesian charts
+        const { x: timestamp } = geometryValue as GeometryValue;
         jumpToTime(timestamp);
         stopAutoReload();
       }

diff --git a/...plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/line.tsx b/...plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/line.tsx
@@ -29,7 +29,6 @@ export const Line: FC<Props> = ({ chartData }) => {
       xAccessor={'time'}
       yAccessors={['value']}
       data={chartData}
-      yScaleToDataExtent={false}
       curve={CurveType.CURVE_MONOTONE_X}
       lineSeriesStyle={lineSeriesStyle}
       color={LINE_COLOR}

diff --git a/...ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/model_bounds.tsx b/...ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/model_bounds.tsx
@@ -42,7 +42,6 @@ export const ModelBounds: FC<Props> = ({ modelData }) => {
       y0Accessors={['modelLower']}
       data={model}
       stackAccessors={['time']}
-      yScaleToDataExtent={false}
       curve={CurveType.CURVE_MONOTONE_X}
       areaSeriesStyle={areaSeriesStyle}
       color={MODEL_COLOR}

diff --git a/...gins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/scatter.tsx b/...gins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/scatter.tsx
@@ -37,7 +37,6 @@ export const Scatter: FC<Props> = ({ chartData }) => {
       xAccessor={'time'}
       yAccessors={['value']}
       data={chartData}
-      yScaleToDataExtent={false}
       curve={CurveType.CURVE_MONOTONE_X}
       lineSeriesStyle={scatterSeriesStyle}
       color={LINE_COLOR}

diff --git a/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/common/axes.tsx b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/common/axes.tsx
@@ -22,7 +22,7 @@ function tickFormatter(d: number): string {
 }
 
 export const Axes: FC<Props> = ({ chartData }) => {
-  const yDomain = chartData !== undefined ? getYRange(chartData) : undefined;
+  const yDomain = getYRange(chartData);
 
   return (
     <Fragment>

diff --git a/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/common/utils.ts b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/common/utils.ts
@@ -5,9 +5,15 @@
  * 2.0.
  */
 
-export function getYRange(chartData: any[]) {
+export function getYRange(chartData?: any[]) {
+  const fit = false;
+
+  if (chartData === undefined) {
+    return { fit };
+  }
+
   if (chartData.length === 0) {
-    return { min: 0, max: 0 };
+    return { min: 0, max: 0, fit };
   }
 
   let max: number = Number.MIN_VALUE;
@@ -24,6 +30,7 @@ export function getYRange(chartData: any[]) {
   return {
     min,
     max,
+    fit,
   };
 }
 

diff --git a/x-pack/plugins/uptime/public/components/common/charts/duration_chart.tsx b/x-pack/plugins/uptime/public/components/common/charts/duration_chart.tsx
@@ -113,7 +113,7 @@ export const DurationChartComponent = ({
             tickFormat={timeFormatter(getChartDateLabel(min, max))}
           />
           <Axis
-            domain={{ min: 0 }}
+            domain={{ min: 0, fit: false }}
             id="left"
             position={Position.Left}
             tickFormat={(d) => getTickFormat(d)}

diff --git a/x-pack/plugins/uptime/public/components/common/charts/duration_line_series_list.tsx b/x-pack/plugins/uptime/public/components/common/charts/duration_line_series_list.tsx
@@ -29,7 +29,6 @@ export const DurationLineSeriesList = ({ monitorType, lines }: Props) => (
         xAccessor={0}
         xScaleType="time"
         yAccessors={[1]}
-        yScaleToDataExtent={false}
         yScaleType="linear"
         fit={Fit.Linear}
         tickFormat={(d) =>

diff --git a/x-pack/test/functional/apps/lens/chart_data.ts b/x-pack/test/functional/apps/lens/chart_data.ts
@@ -107,13 +107,13 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
 
       // assert legend
       expect(debugState.legend!.items).to.eql([
-        { key: '6000', name: '> 6000', color: '#6092c0' },
-        { key: '8000', name: '> 8000', color: '#6092c0' },
-        { key: '10000', name: '> 10000', color: '#a8bfda' },
-        { key: '12000', name: '> 12000', color: '#ebeff5' },
-        { key: '14000', name: '> 14000', color: '#ebeff5' },
-        { key: '16000', name: '> 16000', color: '#ecb385' },
-        { key: '18000', name: '> 18000', color: '#e7664c' },
+        { key: '6000', name: '> 6,000', color: '#6092c0' },
+        { key: '8000', name: '> 8,000', color: '#6092c0' },
+        { key: '10000', name: '> 10,000', color: '#a8bfda' },
+        { key: '12000', name: '> 12,000', color: '#ebeff5' },
+        { key: '14000', name: '> 14,000', color: '#ebeff5' },
+        { key: '16000', name: '> 16,000', color: '#ecb385' },
+        { key: '18000', name: '> 18,000', color: '#e7664c' },
       ]);
     });
 

diff --git a/yarn.lock b/yarn.lock
@@ -1366,10 +1366,10 @@
   dependencies:
     object-hash "^1.3.0"
 
-"@elastic/charts@29.2.0":
-  version "29.2.0"
-  resolved "https://registry.yarnpkg.com/@elastic/charts/-/charts-29.2.0.tgz#cd65887c0ca1d420493aee1b570c862ca0df5311"
-  integrity sha512-gj3Gew9zy8XPNEkAAznOjncO5AF63jy/X1k1VIcNPqdqMi07YYCZwCQjMzUVoS4RN6X4GSzxhrYfGAeyZP8gqg==
+"@elastic/charts@30.0.0":
+  version "30.0.0"
+  resolved "https://registry.yarnpkg.com/@elastic/charts/-/charts-30.0.0.tgz#e19ad8b94928aa9bac5d7facc488fa69b683ff1e"
+  integrity sha512-r22T2dlW3drEmrIx6JNlOOzSp0JCkI/qbIfmvzdMBu8E8hITkJTaXJaLsNN4mz9EvR9jEM8XQQPQXOFKJhWixw==
   dependencies:
     "@popperjs/core" "^2.4.0"
     chroma-js "^2.1.0"