<head>
	<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
	<script src="https://cdn.plot.ly/plotly-locale-fr-latest.js"></script>
</head>

<div id="myDiv" style="width:auto;margin:0 auto;"></div>
var gd = document.getElementById('myDiv');
var x = ["2005-01", "2005-02", "2005-03", "2005-04", "2005-05", "2005-06", "2005-07"];
var y = [-20, 10, -5, 0, 5, -10, 20];
var data = [{
  x: x,
  y: y,
  type: 'scatter'
}];
var layout = {
  xaxis: {
    tickformatstops: [{
        "dtickrange": [null, 1000],
        "value": "%H:%M:%S.%L ms"
      },
      {
        "dtickrange": [1000, 60000],
        "value": "%H:%M:%S s"
      },
      {
        "dtickrange": [60000, 3600000],
        "value": "%H:%M m"
      },
      {
        "dtickrange": [3600000, 86400000],
        "value": "%H:%M h"
      },
      {
        "dtickrange": [86400000, 604800000],
        "value": "%e. %b d"
      },
      {
        "dtickrange": [604800000, "M1"],
        "value": "%e. %b w"
      },
      {
        "dtickrange": ["M1", "M12"],
        "value": "%b '%y M"
      },
      {
        "dtickrange": ["M12", null],
        "value": "%Y Y"
      }
    ]
  }
};

Plotly.plot(gd, data, layout);

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.