Plotly Scatter Axis Tick formatting

by brian428

HTML

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<html>
<body>

<p>
    Plotly Sparkline Test -  
    (<a href="http://bit.ly/1Or9igj">plotly.js documentation</a>)
</p>

<div style="width: 500px;">
  <div id="testChart" style="width:100%; height:40px; border: 1px solid #cccccc"></div>
</div>

</body>
</html>

CSS

html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 20px;
}

JavaScript

var testChart = document.getElementById('testChart');
var traceCount = 1;
var npoints = 60;

var createData = function( dataObj ) {	
  for (var i = 0, l = npoints; i < l; i++) {
      dataObj.y.push(Math.random() * 1000)
      dataObj.x.push(i);
  };
};


let xyData = { x: [], y: [] };
createData( xyData );
    
Plotly.plot( 
    document.getElementById("testChart"), 
    [
    	{
        type: 'scatter',
        mode: 'lines',
        fill: 'tozeroy',
        fillcolor: 'rgba(0, 0, 255, 0.1)', 
        line: {
          width: 1,
          color: 'blue'
        },
        x: xyData.x,
        y: xyData.y
      }
    ], 
    { 
    	showlegend: false,
      margin: { t: 0, b: 0, l: 0, r: 0 },
      xaxis: {
      	ticks: '', 
        showgrid: false, 
        showline: false, 
        zeroline: false, 
        showticklabels: false
      },
			yaxis: { 
      	ticks: '', 
        showgrid: false, 
        showline: false, 
        zeroline: false, 
        showticklabels: false  
      }
    } 
  );