import { boolean } from '@storybook/addon-knobs' ; import React from 'react' ; import { Axis , Chart , BarSeries , Position , ScaleType , Settings } from '@elastic/charts' ; import { useBaseTheme } from '../../use_base_theme' ; export const Example = ( ) => { const includeString = boolean ( 'include string is x data' , true ) ; return ( < Chart > < Settings xDomain = { { min : 0 , max : 10 } } baseTheme = { useBaseTheme ( ) } / > < Axis id = "y" title = "count" position = { Position . Left } / > < Axis id = "x" title = { includeString ? 'ordinal fallback scale' : 'linear scale' } position = { Position . Bottom } / > < BarSeries id = "bars" name = "amount" xScaleType = { ScaleType . Linear } xAccessor = "x" yAccessors = { [ 'y' ] } data = { [ { x : 1 , y : 390 , val : 1222 } , { x : 2 , y : 23 , val : 1222 } , { x : includeString ? '3' : 3 , y : 750 , val : 1222 } , { x : 4 , y : 854 , val : 1222 } , ] } / > < /Chart>); } ; Example . parameters = { markdown : 'Using string values with a `Linear` scale will attempt to fallback to an `Ordinal` scale. Notice how the custom `xDomain` is ignored when the scale falls back to `Ordinal`.' , } ;