title: ReactJS/Nivo Graphs - How to modify the x-axis to be ascending date order when data contains "incomplete" data?
body: <p><strong>Question:</strong> How can I "reformat" the x-axis to be in ascending date, when the data contains a variable amount of dates within it?</p>
  
  <p>I have some data that contains variable amounts of "date" associated with it. For example, Line One contains: </p>
  
  <pre><code>{ x: "2019-05-01", y: 2 },
  { x: "2019-06-01", y: 7 },
  { x: "2020-03-01", y: 1 }
  </code></pre>
  
  <p>Whereas Line Two contains:</p>
  
  <pre><code>{ x: "2019-05-01", y: 1 },
  { x: "2019-06-01", y: 5 },
  { x: "2020-05-01", y: 5 }
  </code></pre>
  
  <p>Code box: <a href="https://codesandbox.io/s/dreamy-almeida-x7rnd?fontsize=14&amp;hidenavigation=1&amp;theme=dark" rel="noreferrer">https://codesandbox.io/s/dreamy-almeida-x7rnd?fontsize=14&amp;hidenavigation=1&amp;theme=dark</a></p>
  
  <p>The data is "uneven" on the x-axis, hence why it looks weird. I realise that if I were to put in "dummy dates" and data to it, then I can dictate the x-axis to become the format I want, the issue is dummy dates + data, because then it doesn't accurately model my database, so I want to avoid something like this.</p>
  
  <p>What I've done so far is look over the documentation, I've tried adding in the <code>type: "time"</code> format to <code>xscale</code>, but I'm getting error</p>
  
  <blockquote>
    <p><code>v.getTime()</code> is not a function.</p>
  </blockquote>