diff --git a/packages/ez-react/src/components/Chart.tsx b/packages/ez-react/src/components/Chart.tsx index 882eb91..748ff8f 100644 --- a/packages/ez-react/src/components/Chart.tsx +++ b/packages/ez-react/src/components/Chart.tsx @@ -117,8 +117,8 @@ export const Chart: FC = ({ const chartData = useMemo(() => { const values = Object.values(dataDict); - return isRTL ? values.reverse() : values; - }, [dataDict, isRTL]); + return values; + }, [dataDict]); const onLegendResize = useCallback( ({ height }: Dimensions) => setLegendHeight(height), diff --git a/packages/ez-react/src/recipes/column/ColumnChart.tsx b/packages/ez-react/src/recipes/column/ColumnChart.tsx index f82a619..a77c0cb 100644 --- a/packages/ez-react/src/recipes/column/ColumnChart.tsx +++ b/packages/ez-react/src/recipes/column/ColumnChart.tsx @@ -91,6 +91,7 @@ export const ColumnChart: FC = ({ definition: { direction: Direction.HORIZONTAL, domainKey: xAxis.domainKey, + reverse: isRTL, }, }} yScaleConfig={{ diff --git a/packages/ez-react/src/recipes/column/LineColumnChart.tsx b/packages/ez-react/src/recipes/column/LineColumnChart.tsx index a15b3ca..0614111 100644 --- a/packages/ez-react/src/recipes/column/LineColumnChart.tsx +++ b/packages/ez-react/src/recipes/column/LineColumnChart.tsx @@ -95,6 +95,7 @@ export const LineColumnChart: FC = ({ definition: { direction: Direction.HORIZONTAL, domainKey: xAxis.domainKey, + reverse: isRTL, }, }} yScaleConfig={{ @@ -122,6 +123,7 @@ export const LineColumnChart: FC = ({ definition: { direction: Direction.HORIZONTAL, domainKey: xAxis.domainKey, + reverse: isRTL, }, }} yScaleConfig={{ diff --git a/packages/ez-vue/src/components/Chart.tsx b/packages/ez-vue/src/components/Chart.tsx index 9bf91f0..185fcc1 100644 --- a/packages/ez-vue/src/components/Chart.tsx +++ b/packages/ez-vue/src/components/Chart.tsx @@ -152,7 +152,7 @@ export default class Chart extends Vue { @Watch('chart.dataDict', { deep: true }) onDataDictChange() { const data = Object.values(this.chart.dataDict); - this.chart.data = this.isRTL ? data.reverse() : data; + this.chart.data = data; } @Watch('isRTL') diff --git a/packages/ez-vue/src/recipes/column/ColumnChart.tsx b/packages/ez-vue/src/recipes/column/ColumnChart.tsx index fa242ec..8632c58 100644 --- a/packages/ez-vue/src/recipes/column/ColumnChart.tsx +++ b/packages/ez-vue/src/recipes/column/ColumnChart.tsx @@ -170,6 +170,7 @@ export default class ColumnChart extends mixins(ToggleDatumMixin) { definition: { direction: Direction.HORIZONTAL, domainKey: xAxis.domainKey, + reverse: isRTL, }, }} yScaleConfig={{ diff --git a/packages/ez-vue/src/recipes/column/LineColumnChart.tsx b/packages/ez-vue/src/recipes/column/LineColumnChart.tsx index a0bbdad..a5ff1be 100644 --- a/packages/ez-vue/src/recipes/column/LineColumnChart.tsx +++ b/packages/ez-vue/src/recipes/column/LineColumnChart.tsx @@ -218,6 +218,7 @@ export default class LineColumnChart extends mixins(ToggleDatumMixin) { definition: { direction: Direction.HORIZONTAL, domainKey: xAxis.domainKey, + reverse: isRTL, }, }} yScaleConfig={{ @@ -255,6 +256,7 @@ export default class LineColumnChart extends mixins(ToggleDatumMixin) { definition: { direction: Direction.HORIZONTAL, domainKey: xAxis.domainKey, + reverse: isRTL, }, }} yScaleConfig={{