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

<body>
<div id="graph"></div>
</body>
var x = Array.from({length: 500}, () => Math.random()*(6-3)+3);
var y = Array.from({length: 500}, () => Math.random()*(6-3)+3);

var data = [{
  x: x,
  y: y,
  type: 'scatter',
  mode: 'markers',
  marker: {
    color: 'rgba(17, 157, 255,0.5)',
    size: 20,
    line: {
      color: 'rgb(231, 99, 250)',
      width: 2
    }
  },
  showlegend: false
  }, {
  x: [2,2],
  y: [4.25,4.75],
  type: 'scatter',
  mode: 'markers',
  marker: {
    color: 'rgba(17, 157, 255,0.5)',
    size: 60,
    line: {
      color: 'rgb(231, 99, 250)',
      width: 6
    }
  },
  showlegend: false
}]

Plotly.plot('graph', data)

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.