Time-averaging code: average over whole spectrum, don't bother with a selection process

smooth.js

setup: function() {
  // code to run on startup
 
smooth_complete = function(row) {
  var orig_img = $('#image')[0]
  $('body').append("<canvas id='tmp_canvas'></canvas>")
  var img = new Image()
  img.src = orig_img.src
  var canvas = $('#tmp_canvas')[0]
  canvas.width = img.width
  canvas.height = img.height
  var rows = img.height
  var ctx = canvas.getContext("2d")
  ctx.drawImage(img,0,0)
 
  var pixels = ctx.getImageData(0,0,canvas.width,rows).data
 
  // now, sum pixels & cheat: just overwrite existing calibrated (or uncalibrated) pixel rows
  $.each($W.spectrum['lines'],function(index,line) {
 
    // clear out existing data
    line['r'] = 0
    line['g'] = 0
    line['b'] = 0
 
    // for each row of data, add new data
    for (var i=0;i<rows;i++) {
      line['r'] += pixels[i*canvas.width*4+index*4]
      line['g'] += pixels[i*canvas.width*4+index*4+1]
      line['b'] += pixels[i*canvas.width*4+index*4+2]
    }
 
    // divide to get average per channel
    line['r'] = line['r']/rows
    line['g'] = line['g']/rows
    line['b'] = line['b']/rows
 
    // average colors to get overall
    line['average'] = (line['r'] + line['g'] + line['b'])/3
 
  })
 
  // graph smoothed data:
  var graph_data = []
  $.each($W.spectrum.lines,function(index,line) {
    if (line.wavelength == null) {
      line.wavelength = index
    }
    graph_data.push([line['wavelength'],line['average']/2.55])
  })
 
  $W.data.push({label: "Smoothed", data: graph_data})
  flotoptions.colors.push("#ff0000")
  $W.plot = $.plot($("#graph"),$W.data,flotoptions);
 
  // upload and save, refresh page 
  // not quite yet
}
 
 
  smooth_complete()
 
},
 
draw: function() {
  // code to run every frame
 
}