title: c3 graph - show timeseries x axis in AM/PM local time
body: <p>I am using the <a href="http://c3js.org" rel="nofollow noreferrer">C3 chart library</a> and have timeseries data where the values for the X axis are in UTC ISO 8601 format, for example <code>2017-01-27T11:24:36.012Z</code> (the same format you get using new Date().toISOString()). I wish to display the ticks in local time.</p>
  
  <p>I set the chart up as follows...</p>
  
  <pre><code>var now = new Date().toISOString();
  
    this.lineChart = generate({
      bindto: '#line',
      transition: {
        duration: 1000
      },        
      data: {
        x: 'x',
        xFormat: '%Y-%m-%dT%H:%M:%S.%LZ',
         columns: [
        ['x', now], 
        ['data1', 0]                   
      ]
      },
      axis: {
        x: {
          type: 'timeseries',
          localtime: true,
          tick: {
            format: '%H:%M %p',
            culling : true,
            rotate : 60
          }
        }
      }
    });
  </code></pre>
  
  <p>and then load in extra data, where I have a start time and end time, and I want to show a point every 15 minutes..</p>
  
  <pre><code>  let startTime = new Date(startDateTime);
    let endTime = new Date(endDateTime);
    let nextDate = startTime;
    let dates = new Array&lt;string&gt;();
    dates.push(nextDate.toISOString());
    let data = [];
    while (nextDate &lt;= endTime) {
      nextDate = moment(nextDate).add(30, 'm').toDate();
      dates.push(nextDate.toISOString());
      data.push(0); // to make them show up!
    }
  
    this.lineChart.load({
      columns: [
        ['x', ...dates],
        ['myData', ...data]          
      ]
    })
  </code></pre>
  
  <p>This produces the following...</p>
  
  <p><a href="https://i.stack.imgur.com/rmZZo.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/rmZZo.png" alt="enter image description here"></a></p>
  
  <p>Two things are wrong here.</p>
  
  <ol>
  <li><p>The data is the UTC time, ie the first value 22:00 is UTC; local time should be +8:00 hours (for my region)</p></li>
  <li><p>If the 22:00 was correct, I would have thought this should show as 10:00 PM, not the 24 hour format.</p></li>
  </ol>
  
  <p>As far as I can see the format strings look correct.</p>
  
  <p>Does anyone know what could be wrong here?</p>
  
  <p>Thanks in advance for any help.</p>