You can create responsive JavaScript charts using ZingChart media rules, which allow you to specify how a chart appears at varying chart dimensions. To get started:

In the chart object, create a mediaRules array in the objects you want media rules applied. In the below example, media rules were created in the legend object, scaleX object, scaleY object, and plot object. In each array, create an object for each breakpoint you want new chart modifications applied. In the below example, breakpoints were specified in each object with the maxWidth attribute at 400 and 600 pixels.


Refer to the Media Rules Tutorial for more information on responsive charting and how to create charts that can be viewed across desktop and mobile devices.


Did this answer your question?