Need help while create chart

[khurram.khan]

hi,
i am using canvas charts in a project, but i am facing difficulty in creating one kind of chart and result, so basically i am creating chart of Stocked column chart but i want multiple X-axis which show me the days, weeks, months and years but facing issue is the X-axis not related with each other. like if date is 1 to 10 the under that axis it show 2 weeks only and one month but its not showing that its look independent . so can i create chart like that ?

[Thangaraj Raman]

@khurram-khan,

You can create a chart with multiple x-axes and use striplines to show labels on these axes based on your requirement as shown in this JSFiddle.

—
Thangaraj Raman
Team CanvasJS

[khurram.khan]

hi,

first of all thanks for the help out, but i have one more thing i want is that in the same chart you see it show gaps in dates not print every date i do while using options interval and interval type the values of labels are overlapping so how can we handle this can option of scroll available so charts will have length so we can scroll that or another thing which i missed please guide me .

[Thangaraj Raman]

@khurram-khan,

To prevent axis labels from overlapping when interval is set, you can rotate the labels using labelAngle.

To make the chart horizontally scrollable, you can use the code snippet below:

<div class="wrapper" style="width: 100%; overflow-x: auto">
  <div id="chartContainer" style="height: 360px; width: 200%;"></div>
</div>

—
Thangaraj Raman
Team CanvasJS

[khurram.khan]

Hi Thangaraj Raman,

thank you so much for the help, I want one more thing to know there is option of bar thickness so can we give margin between bars so they will not overlap if we increase the size of bar thickness. any solution because i have big chart so i need to give gap between 2 bars so my label can easy display .

thanks again.

[Thangaraj Raman]

@khurram-khan,

You can use dataPointWidth to set a custom fixed width for the data points.

Alternatively, you can also set dataPointMaxWidth to automatically limit the width of columns when the number of datapoints increases.

—
Thangaraj Raman
Team CanvasJS