draw your data by zanarmstrong

index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Draw a curve, get coords</title>

    <style>
      #canvas {
        border: solid 5px;
        margin: 20px;
      }
      .clickable {
        cursor: pointer
      }
      p {
        margin: 0px 0px 0px 20px
      }
    </style>
  </head>
  <body>
    <h1>Draw a function</h1>
    <div>
      <p>Note: only one value per x coord will be allowed.</p>
      <canvas id="canvas" width="500" height="300"></canvas>
      <p id="clear" class="clickable">*click to clear*</p>
      <p id="showvalues" class="clickable">*click to paste coordinates*</p>
      <div id="output"></div>
    </div>
    <script src="drawacurve.js"></script>
  </body>
</html

drawacurve.js

var img = new Image();

var canvas = document.getElementById('canvas');

var ctx = canvas.getContext('2d');

let coords = [];

img.onload = function() {
    ctx.drawImage(img, 0, 0);
};

function clearPixel(x,y) {
    var pixel = ctx.getImageData(x, y, 1, 1);
    pixel.data[3] = 0;
    ctx.putImageData(pixel,x,y);
}

function pick(event) {
  var x = event.layerX;
  var y = event.layerY;
  if(coords[x]){
    clearPixel(x,coords[x])
  }
  var pixel = ctx.getImageData(x, y, 1, 1);
  coords[x] = y;
  pixel.data[0] = 0;
  pixel.data[1] = 0;
  pixel.data[2] = 255;
  pixel.data[3] = 255;
  ctx.putImageData(pixel,x,y);
}

canvas.addEventListener('mousemove', function(event) {
    pick(event);
});

document.getElementById('clear').addEventListener('click', function(){
    coords = [];
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    document.getElementById("output").innerHTML = ""
});

document.getElementById('showvalues').addEventListener('click', function(){
    let valueString = "";
    let htmlstring = "<p>x,y</p>"
    coords.forEach((d,i)=>{
        valueString = valueString + i + "," + (canvas.height - d) + "\n";
        htmlstring = htmlstring + "<p>" + i + "," + (canvas.height - d) + "</p>"
    });
    console.log(valueString);
    document.getElementById("output").innerHTML = htmlstring;
});