Matlab-like plotting with mplot.js
basic x,y plotting - lines, points, text
figure(1); x = linspace(-3, 3, 40); y1 = x.map(x => x * x); y2 = x.map(x => 4 * Math.sin(x)); plot(x, y1, 'm-'); plot(x, y2, 'r.'); xlabel('x'); ylabel('y'); gtext('This is a gtext string', -1.5, 8.5, 'g', 18); gtext('parabola', -1.9, 4.2, 'm'); gtext('sine', 1.2, 4.4, 'r');
indexed data (no x values)
figure(2, {height:200, bgcolor:'lightCyan'}); y1 = arange(100).map(i => randf(-i, i)); plot(y1, 'go-'); xlabel('index'); ylabel('value'); yticks(-100, 100, 25);
bar graphs for histograms
figure(3, {bgcolor: 'lavender'}); data = arange(1000).map(() => randn()); bins = arange(-3, 3, 0.5); result = hist(data, bins); plot(bins, result.counts, 'b|'); xticks(-3, 3, 0.5); ylim(0, gca().yticks.max); // force zero xlabel('value'); ylabel('counts');
click functionality
figure(4); xlim(0, 10); ylim(0, 10); gtext('Click me', 4, 5, 'g', 24); gca().onclick = function(x, y) { gca().draw(); // erase previous text let str = sprintf('(%2.1f, %2.1f)', x, y); gtext(str, x, y, 'r', 14); }