title: Make graph on react chart js scrollable with no issues
body: <p>I am using React 15.7 &amp; react-chartjs-2 and i want to display a line graph the has many data points whose numbers varies depending on the time of day. If i simply input these data points on the chart it becomes practically unreadable because the width of the chart is too small for all the data points.</p>
  
  <p>By default the line chart covers all the available page width</p>
  
  <p><a href="https://i.stack.imgur.com/uyQMK.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uyQMK.jpg" alt="Chart"></a></p>
  
  <p>So i tried wrapping the graph in a DIV tag (lets call it "graph wrapper") and dynamically adjusting the width based on how many data points there are each time. Then i wrapped the "graph wrapper" inside a second DIV whose width is the page width and the overflow was set to auto.</p>
  
  <pre><code> &lt;div className={'graph-container'}&gt;
            &lt;div className={'graph-wrapper'} style={{width, height}}&gt;
                     &lt;Line  height={height} data={{datasets,labels}} options={options}/&gt;
            &lt;/div&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>The above solution works but there is one issue. The line breaks after a certain amount of width is reached and only the dots from data points are visible.</p>
  
  <p><a href="https://i.stack.imgur.com/H1aAl.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/H1aAl.jpg" alt="enter image description here"></a></p>
  
  <p>Is there any solution to this? Through plug in or through custom code?</p>