raster drawing NO SVG shape paint
this is the drawing program for raster drawing implmentation
by Nick Hulea
HTML
<script src="http://cdn.eyahuska.com/paper.js"></script>
<canvas resize="true" id="canvas-1" style="width:100%;"></canvas>
<script type="text/paperscript" canvas="canvas-1">
var b, d, g, c, r, i, v, n, a, brush;
var ebd = null;
var iArray = [];
var dArray = [],
rasterArray = [],
rArray = {},
topGroup = new Group(),
mousePath = null;
var imagesArray = ['one.jpg', 'two.jpg', 'three.jpg', 'four.jpg', 'five.jpg'];
var rastera = new Raster({
source: 'http://cdn.eyahuska.com/six.jpg',
// position: view.center,
size: view.bounds
});
rastera.on('load', function() {
loaded = true;
onResize();
});
var rasterb = new Raster({
source: 'http://cdn.eyahuska.com/two.jpg',
position: view.center,
size: view.bounds
});
rasterb.on('load', function() {
loaded = true;
onResize();
});
var brush_origin = new Path.Circle({
radius: 30,
});
brush = brush_origin.clone();
topGroup = new Group([brush, rasterb]);
topGroup.clipped = true;
tool.fixedDistance = 20;
var values = {
color: 'red',
size: 40
};
var components = {
color: {
type: 'color',
label: 'Color',
onChange: function(value) {
values.color = value;
path = new Path({
fillColor: values.color
});
}
},
size: {
type: 'slider',
label: 'Thickness',
min: 5,
max: 100,
onChange: function(value) {
tool.maxDistance = 200 / value;
}
}
}
var path = new Path({
fillColor: values.color
});
var minSize = 1;
var carryLength = 0;
var palette = new Palette('Inkling', components, values);
path = new Path({
fillColor: values.color
});
...