Extension - X-Axis Spacing and Scroll Property

rxp03570 — Tue, 18 Apr 2017 03:50:55 GMT

Problem detail : X-Axis are colliding when it is not filtered by a year, trying to make the X-Axis visible with multiple Year selection. It Works good for a year.

With No filter Selected with multiple years it looks like this:

Issue.jpg

Expected Output :

To show all the years data with similar spacing with scroll

Observations in our trouble shooting :

1. Tried to modify the transform / translate function

//Code

var plot = svg.append("g")

.attr("transform","translate(" + margin.left + "," + margin.top + ")");

var plotWidth = width - margin.left - margin.right;

var plotHeight = svgHeight - margin.top - margin.bottom;

2. Adjusting Width to 100% .

3. CSS container adjusting Div tag to overflow scroll

but none of these helped to resolve the issue , please advise on any suggestions to resolve this .

topic Extension - X-Axis Spacing and Scroll Property in Integration, Extension & APIs

Extension - X-Axis Spacing and Scroll Property