Argument axis labels are overlapping in small screen devices

[ronaldo-mh]

• [x] I have searched this repository's issues and believe that this is not a duplicate.

I'm using ...

• [ ] React Grid
• [x] React Chart
• [ ] React Scheduler

Current Behaviour

On small-screen devices, when creating a Simple Line Chart the Arguments Axis' labels are overlapping with each others.

Checking some global doc seems that it does exist some way to handle it through overlappingBehaviour property for the Label, but it does not work in React implementation: https://js.devexpress.com/Demos/WidgetsGallery/Demo/Charts/AxisLabelsOverlapping/jQuery/Light/

Expected Behaviour

It should be possible to pass this overlappingBehaviour prop to ArgumentAxis.Label component to make this work well.

Steps to Reproduce

It can be reproduced in the Simple Line Chart Demo Page:

1. Navigate to https://devexpress.github.io/devextreme-reactive/react/chart/demos/line/line/
2. Reduce you browser's width, when it is narrow enough (mobile devices width) you will see the problem.

Screenshots

Environment

• devextreme-reactive: 2.0.4
• react: 16.9.0
• browser: Chrome
• material-ui: 4.3.2

[Krijovnick]

Hi @ronaldo-mh

Thank you for your interest in our product. We will consider implementing this feature in the future. Currently, you can use this workaround .

[tsabbay]

The charts are not responsive and you should specify it in your product description as such, especially when there is no clear roadmap for this. This is your component description:(copy and pastes from your repo) HTML5 JavaScript Component Suite for Responsive Web Development

[MaximKudriavtsev]

@tsabbay,

That statement is true for our DevExtreme dxChart widget. It provides special settings for this.

[MrRainesE]

any update on this issue?