html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.format.inputDateTimeFormat('yyyy-MM-dd');

​

anychart.onDocumentReady(function () {

​

  var json = [

    ['2018-01-04', 1000],

    ['2018-01-05', 20000],

    ['2018-01-06', 30000]

  ];

​

    var chart = anychart.area();

    chart.credits().enabled(false);

    var series = chart.area(json);

    var dateTimeScale = anychart.scales.dateTime();

    dateTimeScale.ticks().interval('day',1);

    chart.xScale(dateTimeScale);

    // This moves the plot itself, which is OK

    //  series.left(30);

    //  series.right(30);

    // This doesn't work because it moves both first and last label

    //chart.xAxis().labels().offsetX(-30);

    // This doesn't work because it moves all the labels, even the ones in the middle

    //chart.xAxis().labels().padding().left(50);

    chart.xAxis().labels().format(function () {

        return anychart.format.dateTime(this.value, anychart.format.outputDateFormat());

    });

​

    chart.yGrid().enabled(true);

    chart.yGrid().stroke({dash: "3 5", color: 'lightgray'});

    chart.xGrid().enabled(true);

    chart.xGrid().stroke({dash: "3 5", color: 'lightgray'});

​

​

  // draw

  chart.container("container");

  chart.draw();

});