eessppeelllloo/image-sequencer
1
0
Fork 0
mirror of https://github.com/publiclab/image-sequencer.git synced 2025-12-15 04:40:02 +01:00
Code Issues Packages Projects Releases Wiki Activity

thorough rework of API

Browse Source
This commit is contained in:
jywarren
2017-03-03 10:51:58 -05:00
parent f56e833540
commit fc63c88d5a
11 changed files with 202 additions and 228 deletions
Download Patch File Download Diff File Expand all files Collapse all files

215
dist/image-sequencer.js vendored
View File

@@ -184095,44 +184095,53 @@ if (typeof window !== 'undefined') window.$ = window.jQuery = require('jquery');
ImageSequencer = function ImageSequencer(options) { ImageSequencer = function ImageSequencer(options) {
options = options || {}; options = options || {};
options.defaultSteps = options.defaultSteps || function defaultSteps() { options.inBrowser = options.inBrowser || typeof window !== 'undefined';
addStep('image-select'); options.ui = options.ui || require('./UserInterface');
}
var image, var image,
steps = [], steps = [],
modules = require('./Modules'); modules = require('./Modules');
options.ui = options.ui || require('./UserInterface')(); // if in browser, prompt for an image
if (options.imageSelect || options.inBrowser) addStep('image-select', { selector: "#drop" });
options.defaultSteps(); else if (options.imageUrl) loadImage(imageUrl);
// soon, detect local or URL?
function addStep(name, o) { function addStep(name, o) {
console.log('adding step "' + name + '"'); console.log('adding step "' + name + '"');
o = o || {}; o = o || {};
o.name = o.name || name;
o.selector = o.selector || 'ismod-' + name;
o.container = o.container || options.selector; o.container = o.container || options.selector;
o.createUserInterface = o.createUserInterface || options.ui.create;
var module = modules[name](o); var module = modules[name](o);
steps.push(module); steps.push(module);
if (steps.length > 1) { if (module.name !== "image-select") {
if (module.setup) module.setup();
var lastStep = steps[steps.length - 2]; // add a default UI, unless the module has one specified
if (module.hasOwnProperty('setup')) module.setup();
// connect last step to input of this step else {
lastStep.options.onComplete = function onComplete(_image) { setup.apply(module); // run default setup() in scope of module (is this right?)
log('running module "' + name + '"'); function setup() {
if (lastStep.options.ui) lastStep.options.ui.el.html(_image); module.options.ui = options.ui({
module.draw(_image); selector: o.selector
});
}
} }
module.options.onComplete = function onComplete(_image) { var previousStep = steps[steps.length - 2];
if (module.options.ui) module.options.ui.el.html(_image);
if (previousStep) {
// connect output of last step to input of this step
previousStep.options.output = function output(image) {
log('running module "' + name + '"');
// display the image in any available ui
if (previousStep.options.ui && previousStep.options.ui.display) previousStep.options.ui.display(image);
module.draw(image);
}
} }
} else { } else {
@@ -184140,6 +184149,20 @@ ImageSequencer = function ImageSequencer(options) {
module.setup(); // just set up initial ImageSelect module.setup(); // just set up initial ImageSelect
} }
// Pre-set the initial output behavior of the final step,
// which will be changed if an additional step is added.
module.options.output = function output(image) {
if (module.options.ui && module.options.ui.display) module.options.ui.display(image);
}
}
// passed image is optional but you can pass a
// non-stored image through the whole steps chain
function run(image) {
if (image) steps[1].draw(image);
else steps[0].draw();
} }
function log(msg) { function log(msg) {
@@ -184147,27 +184170,17 @@ ImageSequencer = function ImageSequencer(options) {
console.log(msg); console.log(msg);
} }
function run() {
steps[0].draw();
}
// load default starting image // load default starting image
// i.e. from parameter // i.e. from parameter
// this could send the image to ImageSelect, or something? // this could send the image to ImageSelect, or something?
// not currently working // not currently working
function loadImage(src, callback) { function loadImage(src, callback) {
image = new Image(); image = new Image();
image.onload = function() { image.onload = function() {
run(); run(image);
if (callback) callback(image); if (callback) callback(image);
} }
image.src = src; image.src = src;
} }
return { return {
@@ -184199,38 +184212,40 @@ module.exports = {
},{"./modules/GreenChannel":1610,"./modules/ImageSelect":1611,"./modules/ImageThreshold":1612,"./modules/NdviRed":1613,"./modules/Plot":1615}],1609:[function(require,module,exports){ },{"./modules/GreenChannel":1610,"./modules/ImageSelect":1611,"./modules/ImageThreshold":1612,"./modules/NdviRed":1613,"./modules/Plot":1615}],1609:[function(require,module,exports){
/* /*
* Default UI for ImageBoard * Default UI for each image-sequencer module
*/ */
module.exports = function UserInterface(options) { module.exports = function UserInterface(options) {
options = options || {}; options = options || {};
options.container = options.container || ".panels"; options.container = options.container || ".panels";
// method to create a UI for a given module options.random = options.random || parseInt(Math.random() * (new Date()).getTime() / 1000000);
function create(o) { options.uniqueSelector = options.uniqueSelector || options.selector + '-' + options.random;
o.random = o.random || parseInt(Math.random() * (new Date()).getTime() / 1000000); $(options.container).append('<div class="panel ' + options.selector + ' ' + options.uniqueSelector + '"></div>');
o.uniqueSelector = o.uniqueSelector || o.selector + '-' + o.random; options.el = options.el || $('.' + options.uniqueSelector);
$(options.container).append('<div class="panel ' + o.selector + ' ' + o.uniqueSelector + '"></div>'); createLabel(options.el);
o.el = o.el || $('.' + o.uniqueSelector);
return { // method to remove the UI for a given method, and remove the step
el: o.el, function display(image) {
uniqueSelector: o.uniqueSelector, options.el.html(image);
selector: o.selector
}
} }
// method to remove the UI for a given method, and remove the step // method to remove the UI for a given method, and remove the step
function remove() { function remove() {}
}
// method to reorder steps, and update the UI // method to reorder steps, and update the UI
//function move() { //function move() {}
//} function createLabel(el) {
console.log("createLabel", module.title)
el.append('<h3 class="title">' + module.title + '</h3>');
}
return { return {
create: create, el: options.el,
uniqueSelector: options.uniqueSelector,
selector: options.selector,
display: display,
remove: remove remove: remove
} }
@@ -184244,31 +184259,24 @@ module.exports = function GreenChannel(options) {
options = options || {}; options = options || {};
var image; //function setup() {} // optional
function setup() { function draw(image) {
options.ui = options.createUserInterface({ function changePixel(r, g, b, a) {
selector: 'mod-green-channel' return [0, g, 0, a];
}); }
} return require('./PixelManipulation.js')(image, {
output: options.output,
function draw(_image) {
// PixelManipulation returns an image
require('./PixelManipulation.js')(_image, {
onComplete: options.onComplete,
changePixel: changePixel changePixel: changePixel
}); });
} }
function changePixel(r, g, b, a) {
return [0, g, 0, a];
}
return { return {
title: "Green channel only", title: "Green channel only",
description: "Displays only the green channel of an image",
options: options, options: options,
draw: draw, //setup: setup, // optional
setup: setup draw: draw
} }
} }
@@ -184279,7 +184287,7 @@ module.exports = function GreenChannel(options) {
*/ */
module.exports = function ImageSelect(options) { module.exports = function ImageSelect(options) {
//window.$ = window.jQuery = require('jquery'); if (!window.hasOwnProperty('$')) window.$ = window.jQuery = require('jquery');
options = options || {}; options = options || {};
options.selector = options.selector || "#drop"; options.selector = options.selector || "#drop";
@@ -184287,11 +184295,11 @@ module.exports = function ImageSelect(options) {
options.ui = options.ui || {}; options.ui = options.ui || {};
options.ui.el = options.ui.el || $(options.selector); options.ui.el = options.ui.el || $(options.selector);
if (options.ui.el.length === 0) console.log('No UI element found with given selector: ', options.selector);
var image, var image,
el = options.ui.el; el = options.ui.el;
console.log(el,$('body'));
function setup() { function setup() {
// CSS UI // CSS UI
@@ -184325,7 +184333,7 @@ console.log(el,$('body'));
el.html(image); // may be redundant el.html(image); // may be redundant
// this is done once per image: // this is done once per image:
options.onComplete(image); options.output(image);
} }
reader.readAsDataURL(f); reader.readAsDataURL(f);
@@ -184344,8 +184352,10 @@ console.log(el,$('body'));
} }
function draw(_image) { // this module is unique because it creates the image
if (options.onComplete) options.onComplete(image); function draw(image) {
options.ui.display(image);
if (options.output) options.output(image);
} }
function get() { function get() {
@@ -184362,7 +184372,7 @@ console.log(el,$('body'));
} }
},{}],1612:[function(require,module,exports){ },{"jquery":89}],1612:[function(require,module,exports){
/* /*
* Image thresholding with 'image-filter-threshold' * Image thresholding with 'image-filter-threshold'
*/ */
@@ -184373,19 +184383,13 @@ module.exports = function ImageThreshold(options) {
var image; var image;
function setup() { function draw(inputImage) {
options.ui = options.createUserInterface({
selector: 'mod-image-threshold'
});
}
function draw(_image) {
var canvas = document.createElement('canvas'); var canvas = document.createElement('canvas');
canvas.width = _image.naturalWidth; canvas.width = inputImage.naturalWidth;
canvas.height = _image.naturalHeight; canvas.height = inputImage.naturalHeight;
var context = canvas.getContext('2d'); var context = canvas.getContext('2d');
context.drawImage(_image, 0, 0 ); context.drawImage(inputImage, 0, 0 );
var imageData = context.getImageData(0, 0, _image.naturalWidth, _image.naturalHeight); var imageData = context.getImageData(0, 0, inputImage.naturalWidth, inputImage.naturalHeight);
var imageThreshold = require('image-filter-threshold'); var imageThreshold = require('image-filter-threshold');
var imageFilterCore = require('image-filter-core'); var imageFilterCore = require('image-filter-core');
@@ -184396,7 +184400,7 @@ module.exports = function ImageThreshold(options) {
}).then(function (imageData) { }).then(function (imageData) {
image = new Image(); image = new Image();
image.onload = function onLoad() { image.onload = function onLoad() {
if (options.onComplete) options.onComplete(image); if (options.output) options.output(image);
} }
image.src = imageFilterCore.convertImageDataToCanvasURL(imageData); image.src = imageFilterCore.convertImageDataToCanvasURL(imageData);
}); });
@@ -184409,7 +184413,6 @@ module.exports = function ImageThreshold(options) {
return { return {
title: "Threshold image", title: "Threshold image",
options: options, options: options,
setup: setup,
draw: draw, draw: draw,
get: get get: get
} }
@@ -184423,31 +184426,24 @@ module.exports = function NdviRed(options) {
options = options || {}; options = options || {};
var image; //function setup() {} // optional
function setup() { function draw(image) {
options.ui = options.createUserInterface({ function changePixel(r, g, b, a) {
selector: 'mod-ndvi-red' var ndvi = 255 * (b - r) / (1.00 * b + r);
}); return [ndvi, ndvi, ndvi, a];
} }
return require('./PixelManipulation.js')(image, {
function draw(_image) { output: options.output,
require('./PixelManipulation.js')(_image, {
onComplete: options.onComplete,
changePixel: changePixel changePixel: changePixel
}); });
} }
function changePixel(r, g, b, a) {
var ndvi = 255 * (b - r) / (1.00 * b + r);
return [ndvi, ndvi, ndvi, a];
}
return { return {
title: "NDVI for red-filtered cameras (blue is infrared)", title: "NDVI for red-filtered cameras (blue is infrared)",
options: options, options: options,
draw: draw, //setup: setup, // optional
setup: setup draw: draw
} }
} }
@@ -184506,7 +184502,7 @@ module.exports = function PixelManipulation(image, options) {
img.src = 'data:image/' + options.format + ';base64,' + buffer.read().toString(); img.src = 'data:image/' + options.format + ';base64,' + buffer.read().toString();
if (options.onComplete) options.onComplete(img); if (options.output) options.output(img);
}).pipe(buffer); }).pipe(buffer);
@@ -184526,14 +184522,6 @@ module.exports = function Plot(options) {
var image; var image;
function setup() {
options.ui = options.createUserInterface({
selector: 'mod-plot'
});
}
function draw(_image) { function draw(_image) {
/* https://plot.ly/javascript/heatmap-and-contour-colorscales/#custom-colorscale /* https://plot.ly/javascript/heatmap-and-contour-colorscales/#custom-colorscale
@@ -184578,7 +184566,7 @@ module.exports = function Plot(options) {
Plotly.newPlot('plot-' + random, data, layout) Plotly.newPlot('plot-' + random, data, layout)
/* .then(function afterPlot(graphData) { /* .then(function afterPlot(graphData) {
options.onComplete(Plotly.toImage(graphData, { options.output(Plotly.toImage(graphData, {
format: 'jpeg', format: 'jpeg',
height: _image.height, height: _image.height,
width: _image.width width: _image.width
@@ -184593,8 +184581,7 @@ module.exports = function Plot(options) {
return { return {
title: "Plot with colorbar", title: "Plot with colorbar",
options: options, options: options,
draw: draw, draw: draw
setup: setup
} }
} }

2
index.html
View File

@@ -65,7 +65,7 @@
sequencer = ImageSequencer(); sequencer = ImageSequencer();
// sequencer.loadImage('examples/grid.png'); sequencer.loadImage('examples/grid.png');
sequencer.addStep('ndvi-red'); sequencer.addStep('ndvi-red');
sequencer.addStep('image-threshold'); sequencer.addStep('image-threshold');

0
src/ImageSequencer.AddStep.js Normal file
View File

73
src/ImageSequencer.js
View File

@@ -3,44 +3,53 @@ if (typeof window !== 'undefined') window.$ = window.jQuery = require('jquery');
ImageSequencer = function ImageSequencer(options) { ImageSequencer = function ImageSequencer(options) {
options = options || {}; options = options || {};
options.defaultSteps = options.defaultSteps || function defaultSteps() { options.inBrowser = options.inBrowser || typeof window !== 'undefined';
addStep('image-select'); options.ui = options.ui || require('./UserInterface');
}
var image, var image,
steps = [], steps = [],
modules = require('./Modules'); modules = require('./Modules');
options.ui = options.ui || require('./UserInterface')(); // if in browser, prompt for an image
if (options.imageSelect || options.inBrowser) addStep('image-select', { selector: "#drop" });
options.defaultSteps(); else if (options.imageUrl) loadImage(imageUrl);
// soon, detect local or URL?
function addStep(name, o) { function addStep(name, o) {
console.log('adding step "' + name + '"'); console.log('adding step "' + name + '"');
o = o || {}; o = o || {};
o.name = o.name || name;
o.selector = o.selector || 'ismod-' + name;
o.container = o.container || options.selector; o.container = o.container || options.selector;
o.createUserInterface = o.createUserInterface || options.ui.create;
var module = modules[name](o); var module = modules[name](o);
steps.push(module); steps.push(module);
if (steps.length > 1) { if (module.name !== "image-select") {
if (module.setup) module.setup();
var lastStep = steps[steps.length - 2]; // add a default UI, unless the module has one specified
if (module.hasOwnProperty('setup')) module.setup();
// connect last step to input of this step else {
lastStep.options.onComplete = function onComplete(_image) { setup.apply(module); // run default setup() in scope of module (is this right?)
log('running module "' + name + '"'); function setup() {
if (lastStep.options.ui) lastStep.options.ui.el.html(_image); module.options.ui = options.ui({
module.draw(_image); selector: o.selector
});
}
} }
module.options.onComplete = function onComplete(_image) { var previousStep = steps[steps.length - 2];
if (module.options.ui) module.options.ui.el.html(_image);
if (previousStep) {
// connect output of last step to input of this step
previousStep.options.output = function output(image) {
log('running module "' + name + '"');
// display the image in any available ui
if (previousStep.options.ui && previousStep.options.ui.display) previousStep.options.ui.display(image);
module.draw(image);
}
} }
} else { } else {
@@ -48,6 +57,20 @@ ImageSequencer = function ImageSequencer(options) {
module.setup(); // just set up initial ImageSelect module.setup(); // just set up initial ImageSelect
} }
// Pre-set the initial output behavior of the final step,
// which will be changed if an additional step is added.
module.options.output = function output(image) {
if (module.options.ui && module.options.ui.display) module.options.ui.display(image);
}
}
// passed image is optional but you can pass a
// non-stored image through the whole steps chain
function run(image) {
if (image) steps[1].draw(image);
else steps[0].draw();
} }
function log(msg) { function log(msg) {
@@ -55,27 +78,17 @@ ImageSequencer = function ImageSequencer(options) {
console.log(msg); console.log(msg);
} }
function run() {
steps[0].draw();
}
// load default starting image // load default starting image
// i.e. from parameter // i.e. from parameter
// this could send the image to ImageSelect, or something? // this could send the image to ImageSelect, or something?
// not currently working // not currently working
function loadImage(src, callback) { function loadImage(src, callback) {
image = new Image(); image = new Image();
image.onload = function() { image.onload = function() {
run(); run(image);
if (callback) callback(image); if (callback) callback(image);
} }
image.src = src; image.src = src;
} }
return { return {

38
src/UserInterface.js
View File

@@ -1,36 +1,38 @@
/* /*
* Default UI for ImageBoard * Default UI for each image-sequencer module
*/ */
module.exports = function UserInterface(options) { module.exports = function UserInterface(options) {
options = options || {}; options = options || {};
options.container = options.container || ".panels"; options.container = options.container || ".panels";
// method to create a UI for a given module options.random = options.random || parseInt(Math.random() * (new Date()).getTime() / 1000000);
function create(o) { options.uniqueSelector = options.uniqueSelector || options.selector + '-' + options.random;
o.random = o.random || parseInt(Math.random() * (new Date()).getTime() / 1000000); $(options.container).append('<div class="panel ' + options.selector + ' ' + options.uniqueSelector + '"></div>');
o.uniqueSelector = o.uniqueSelector || o.selector + '-' + o.random; options.el = options.el || $('.' + options.uniqueSelector);
$(options.container).append('<div class="panel ' + o.selector + ' ' + o.uniqueSelector + '"></div>'); createLabel(options.el);
o.el = o.el || $('.' + o.uniqueSelector);
return { // method to remove the UI for a given method, and remove the step
el: o.el, function display(image) {
uniqueSelector: o.uniqueSelector, options.el.html(image);
selector: o.selector
}
} }
// method to remove the UI for a given method, and remove the step // method to remove the UI for a given method, and remove the step
function remove() { function remove() {}
}
// method to reorder steps, and update the UI // method to reorder steps, and update the UI
//function move() { //function move() {}
//} function createLabel(el) {
console.log("createLabel", module.title)
el.append('<h3 class="title">' + module.title + '</h3>');
}
return { return {
create: create, el: options.el,
uniqueSelector: options.uniqueSelector,
selector: options.selector,
display: display,
remove: remove remove: remove
} }

27
src/modules/GreenChannel.js
View File

@@ -5,30 +5,23 @@ module.exports = function GreenChannel(options) {
options = options || {}; options = options || {};
var image; //function setup() {} // optional
function setup() { function draw(image) {
options.ui = options.createUserInterface({ function changePixel(r, g, b, a) {
selector: 'mod-green-channel' return [0, g, 0, a];
}); }
} return require('./PixelManipulation.js')(image, {
output: options.output,
function draw(_image) {
// PixelManipulation returns an image
require('./PixelManipulation.js')(_image, {
onComplete: options.onComplete,
changePixel: changePixel changePixel: changePixel
}); });
} }
function changePixel(r, g, b, a) {
return [0, g, 0, a];
}
return { return {
title: "Green channel only", title: "Green channel only",
description: "Displays only the green channel of an image",
options: options, options: options,
draw: draw, //setup: setup, // optional
setup: setup draw: draw
} }
} }

14
src/modules/ImageSelect.js
View File

@@ -4,7 +4,7 @@
*/ */
module.exports = function ImageSelect(options) { module.exports = function ImageSelect(options) {
//window.$ = window.jQuery = require('jquery'); if (!window.hasOwnProperty('$')) window.$ = window.jQuery = require('jquery');
options = options || {}; options = options || {};
options.selector = options.selector || "#drop"; options.selector = options.selector || "#drop";
@@ -12,11 +12,11 @@ module.exports = function ImageSelect(options) {
options.ui = options.ui || {}; options.ui = options.ui || {};
options.ui.el = options.ui.el || $(options.selector); options.ui.el = options.ui.el || $(options.selector);
if (options.ui.el.length === 0) console.log('No UI element found with given selector: ', options.selector);
var image, var image,
el = options.ui.el; el = options.ui.el;
console.log(el,$('body'));
function setup() { function setup() {
// CSS UI // CSS UI
@@ -50,7 +50,7 @@ console.log(el,$('body'));
el.html(image); // may be redundant el.html(image); // may be redundant
// this is done once per image: // this is done once per image:
options.onComplete(image); options.output(image);
} }
reader.readAsDataURL(f); reader.readAsDataURL(f);
@@ -69,8 +69,10 @@ console.log(el,$('body'));
} }
function draw(_image) { // this module is unique because it creates the image
if (options.onComplete) options.onComplete(image); function draw(image) {
options.ui.display(image);
if (options.output) options.output(image);
} }
function get() { function get() {

19
src/modules/ImageThreshold.js
View File

@@ -8,19 +8,13 @@ module.exports = function ImageThreshold(options) {
var image; var image;
function setup() { function draw(inputImage) {
options.ui = options.createUserInterface({
selector: 'mod-image-threshold'
});
}
function draw(_image) {
var canvas = document.createElement('canvas'); var canvas = document.createElement('canvas');
canvas.width = _image.naturalWidth; canvas.width = inputImage.naturalWidth;
canvas.height = _image.naturalHeight; canvas.height = inputImage.naturalHeight;
var context = canvas.getContext('2d'); var context = canvas.getContext('2d');
context.drawImage(_image, 0, 0 ); context.drawImage(inputImage, 0, 0 );
var imageData = context.getImageData(0, 0, _image.naturalWidth, _image.naturalHeight); var imageData = context.getImageData(0, 0, inputImage.naturalWidth, inputImage.naturalHeight);
var imageThreshold = require('image-filter-threshold'); var imageThreshold = require('image-filter-threshold');
var imageFilterCore = require('image-filter-core'); var imageFilterCore = require('image-filter-core');
@@ -31,7 +25,7 @@ module.exports = function ImageThreshold(options) {
}).then(function (imageData) { }).then(function (imageData) {
image = new Image(); image = new Image();
image.onload = function onLoad() { image.onload = function onLoad() {
if (options.onComplete) options.onComplete(image); if (options.output) options.output(image);
} }
image.src = imageFilterCore.convertImageDataToCanvasURL(imageData); image.src = imageFilterCore.convertImageDataToCanvasURL(imageData);
}); });
@@ -44,7 +38,6 @@ module.exports = function ImageThreshold(options) {
return { return {
title: "Threshold image", title: "Threshold image",
options: options, options: options,
setup: setup,
draw: draw, draw: draw,
get: get get: get
} }

27
src/modules/NdviRed.js
View File

@@ -5,30 +5,23 @@ module.exports = function NdviRed(options) {
options = options || {}; options = options || {};
var image; //function setup() {} // optional
function setup() { function draw(image) {
options.ui = options.createUserInterface({ function changePixel(r, g, b, a) {
selector: 'mod-ndvi-red' var ndvi = 255 * (b - r) / (1.00 * b + r);
}); return [ndvi, ndvi, ndvi, a];
} }
return require('./PixelManipulation.js')(image, {
function draw(_image) { output: options.output,
require('./PixelManipulation.js')(_image, {
onComplete: options.onComplete,
changePixel: changePixel changePixel: changePixel
}); });
} }
function changePixel(r, g, b, a) {
var ndvi = 255 * (b - r) / (1.00 * b + r);
return [ndvi, ndvi, ndvi, a];
}
return { return {
title: "NDVI for red-filtered cameras (blue is infrared)", title: "NDVI for red-filtered cameras (blue is infrared)",
options: options, options: options,
draw: draw, //setup: setup, // optional
setup: setup draw: draw
} }
} }

2
src/modules/PixelManipulation.js
View File

@@ -52,7 +52,7 @@ module.exports = function PixelManipulation(image, options) {
img.src = 'data:image/' + options.format + ';base64,' + buffer.read().toString(); img.src = 'data:image/' + options.format + ';base64,' + buffer.read().toString();
if (options.onComplete) options.onComplete(img); if (options.output) options.output(img);
}).pipe(buffer); }).pipe(buffer);

13
src/modules/Plot.js
View File

@@ -9,14 +9,6 @@ module.exports = function Plot(options) {
var image; var image;
function setup() {
options.ui = options.createUserInterface({
selector: 'mod-plot'
});
}
function draw(_image) { function draw(_image) {
/* https://plot.ly/javascript/heatmap-and-contour-colorscales/#custom-colorscale /* https://plot.ly/javascript/heatmap-and-contour-colorscales/#custom-colorscale
@@ -61,7 +53,7 @@ module.exports = function Plot(options) {
Plotly.newPlot('plot-' + random, data, layout) Plotly.newPlot('plot-' + random, data, layout)
/* .then(function afterPlot(graphData) { /* .then(function afterPlot(graphData) {
options.onComplete(Plotly.toImage(graphData, { options.output(Plotly.toImage(graphData, {
format: 'jpeg', format: 'jpeg',
height: _image.height, height: _image.height,
width: _image.width width: _image.width
@@ -76,7 +68,6 @@ module.exports = function Plot(options) {
return { return {
title: "Plot with colorbar", title: "Plot with colorbar",
options: options, options: options,
draw: draw, draw: draw
setup: setup
} }
} }