diff --git a/package.json b/package.json index 32c4420276821..025a278d197a1 100644 --- 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 index 91647f02e2a1e..08b17c882eea6 100644 --- 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( 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 index 0a657b5242427..dd1023e7f0185 100644 --- 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 = ({ 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/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/line.tsx b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/line.tsx index 28194e2d453ac..855c66e1e1c0d 100644 --- a/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/line.tsx +++ b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/line.tsx @@ -29,7 +29,6 @@ export const Line: FC = ({ chartData }) => { xAccessor={'time'} yAccessors={['value']} data={chartData} - yScaleToDataExtent={false} curve={CurveType.CURVE_MONOTONE_X} lineSeriesStyle={lineSeriesStyle} color={LINE_COLOR} diff --git a/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/model_bounds.tsx b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/model_bounds.tsx index a2d2bad5a503e..fe07c6800c0e8 100644 --- a/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/model_bounds.tsx +++ b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/model_bounds.tsx @@ -42,7 +42,6 @@ export const ModelBounds: FC = ({ modelData }) => { y0Accessors={['modelLower']} data={model} stackAccessors={['time']} - yScaleToDataExtent={false} curve={CurveType.CURVE_MONOTONE_X} areaSeriesStyle={areaSeriesStyle} color={MODEL_COLOR} diff --git a/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/scatter.tsx b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/scatter.tsx index cbe3a99512d1e..bc6d0065fec8e 100644 --- a/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/scatter.tsx +++ b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/charts/anomaly_chart/scatter.tsx @@ -37,7 +37,6 @@ export const Scatter: FC = ({ 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 index 320faf0bbc615..bbd700a0ef8e1 100644 --- 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 = ({ chartData }) => { - const yDomain = chartData !== undefined ? getYRange(chartData) : undefined; + const yDomain = getYRange(chartData); return ( 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 index 8623133fa7835..c55bb769b6eb9 100644 --- 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 index 1f1e80838b658..c7884683e1aed 100644 --- 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))} /> 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 index a13696a6379b3..4ccbbd37b041b 100644 --- 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 index 24aaab9807494..498c722f33c2e 100644 --- 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 index df3852fdd5220..9d52d4c32e8b5 100644 --- 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"