<div id="timeline-diagram-default"></div>
<div id="timeline-diagram-customized"></div>

<script>
  d3.json('../data/historical-web-browsers.json', function (data) {
    d3.shuffle(data);
    d3.timelineDiagram(data, { id: 'timeline-diagram-default' });
  });
  d3.json('../data/historical-web-browsers.json', function (data) {
    d3.shuffle(data);
    d3.timelineDiagram(data, {
      id: 'timeline-diagram-customized',
      domain: ['1994', '2017'],
      scale: 'scaleLinear',
      axis: {
        label: false,
        ticks: {
          sizeInner: 6,
          format: d3.timeFormat('%Y')
        }
      },
      connectors: {
        dx: '2.5%'
      },
      dots: {
        multicolor: true
      }
    });
  });
</script>