This commit is contained in:
lxsang 2019-05-06 19:15:23 +02:00
parent 89495d96a6
commit ddba25df0c
3 changed files with 133 additions and 28 deletions

View File

@ -16,7 +16,7 @@
} }
getBound() { getBound() {
var i, len, peak_rb, peak_tl, ref, start, v, x, y; var j, len, peak_rb, peak_tl, ref, start, v, x, y;
peak_tl = { peak_tl = {
x: 0, x: 0,
y: 0 y: 0
@ -27,8 +27,8 @@
}; };
start = null; start = null;
ref = this.target.data; ref = this.target.data;
for (i = 0, len = ref.length; i < len; i++) { for (j = 0, len = ref.length; j < len; j++) {
v = ref[i]; v = ref[j];
x = v[0] / this.target.resolution; x = v[0] / this.target.resolution;
y = v[1] / this.target.resolution; y = v[1] / this.target.resolution;
if (x < peak_tl.x) { if (x < peak_tl.x) {
@ -53,30 +53,84 @@
return this.height = peak_rb.y - peak_tl.y + 2 * this.offset; return this.height = peak_rb.y - peak_tl.y + 2 * this.offset;
} }
prepare() { drawPoint(v, color, size) {
var ctx, end, path, start; // center
ctx = this.el.getContext("2d"); return new paper.Path.Circle({
ctx.translate(this.base.x, this.base.y); center: this.canvasPoint(v),
ctx.canvas.width = this.width; radius: size,
ctx.canvas.height = this.height; fillColor: color
paper.setup(this.el); });
// draw the base }
drawGrid(size, color) {
var end, i, path, results, start, wgridsize;
wgridsize = this.target.resolution * size;
// draw y line
i = Math.ceil(this.bound[0].x / wgridsize);
while (i * wgridsize < this.bound[1].x) {
start = this.canvasPoint([i * wgridsize, this.bound[0].y]);
end = this.canvasPoint([i * wgridsize, this.bound[1].y]);
path = new paper.Path();
path.strokeColor = color;
path.moveTo(start);
path.lineTo(end);
i++;
}
// draw x line
i = Math.ceil(this.bound[0].y / wgridsize);
results = [];
while (i * wgridsize < this.bound[1].y) {
start = this.canvasPoint([this.bound[0].x, i * wgridsize]);
end = this.canvasPoint([this.bound[1].x, i * wgridsize]);
path = new paper.Path();
path.strokeColor = color;
path.moveTo(start);
path.lineTo(end);
results.push(i++);
}
return results;
}
drawAxis(color) {
var end, path, start;
// x axis // x axis
path = new paper.Path(); path = new paper.Path();
path.strokeColor = '#BBBBBB'; path.strokeColor = color;
start = this.canvasPoint([this.bound[0].x, 0]); start = this.canvasPoint([this.bound[0].x, 0]);
end = this.canvasPoint([this.bound[1].x, 0]); end = this.canvasPoint([this.bound[1].x, 0]);
path.moveTo(start); path.moveTo(start);
path.lineTo(end); path.lineTo(end);
// y axis // y axis
path = new paper.Path(); path = new paper.Path();
path.strokeColor = '#BBBBBB'; path.strokeColor = color;
start = this.canvasPoint([0, this.bound[0].y]); start = this.canvasPoint([0, this.bound[0].y]);
end = this.canvasPoint([0, this.bound[1].y]); end = this.canvasPoint([0, this.bound[1].y]);
path.moveTo(start); path.moveTo(start);
return path.lineTo(end); path.lineTo(end);
return this.drawPoint([0, 0], color, 3);
} }
prepare() {
var ctx;
ctx = this.el.getContext("2d");
ctx.translate(this.base.x, this.base.y);
ctx.canvas.width = this.width;
ctx.canvas.height = this.height;
return paper.setup(this.el);
}
//tool = new paper.Tool()
//hitOptions = {
// segments: true,
// stroke: true,
// fill: true,
// tolerance: 5
//}
//tool.onMouseMove = (event) ->
// hitResult = paper.project.hitTest event.point, hitOptions
// return unless hitResult
// console.log hitResult
render() {} render() {}
}; };
@ -90,13 +144,15 @@
// point clound render // point clound render
render() { render() {
var i, len, path, point, ref, start, v; var j, len, path, point, ref, start, v;
this.drawGrid(20, "#DBDBDB"); // 20 px
this.drawAxis("#0A84FF");
path = new paper.Path(); path = new paper.Path();
path.strokeColor = 'black'; path.strokeColor = 'black';
start = null; start = null;
ref = this.target.data; ref = this.target.data;
for (i = 0, len = ref.length; i < len; i++) { for (j = 0, len = ref.length; j < len; j++) {
v = ref[i]; v = ref[j];
point = this.canvasPoint(v); point = this.canvasPoint(v);
if (!start) { if (!start) {
start = point; start = point;
@ -104,6 +160,7 @@
} else { } else {
path.lineTo(point); path.lineTo(point);
} }
this.drawPoint(v, "black", 4);
} }
return paper.view.draw(); return paper.view.draw();
} }

View File

@ -26,27 +26,72 @@ class DataViewer
@base = {x: 0 - @bound[0].x+ @offset, y: @bound[1].y + @offset} @base = {x: 0 - @bound[0].x+ @offset, y: @bound[1].y + @offset}
@width = peak_rb.x - peak_tl.x + 2*@offset @width = peak_rb.x - peak_tl.x + 2*@offset
@height = peak_rb.y - peak_tl.y + 2*@offset @height = peak_rb.y - peak_tl.y + 2*@offset
prepare: () ->
ctx = @el.getContext "2d" drawPoint: (v, color, size) ->
ctx.translate(@base.x, @base.y) # center
ctx.canvas.width = @width new paper.Path.Circle {
ctx.canvas.height = @height center: @canvasPoint(v),
paper.setup @el radius: size,
# draw the base fillColor: color
}
drawGrid: (size, color) ->
wgridsize = @target.resolution*size
# draw y line
i = Math.ceil(@bound[0].x / wgridsize)
while i*wgridsize < @bound[1].x
start = @canvasPoint [i*wgridsize, @bound[0].y]
end = @canvasPoint [i*wgridsize, @bound[1].y]
path = new paper.Path()
path.strokeColor = color
path.moveTo start
path.lineTo end
i++
# draw x line
i = Math.ceil(@bound[0].y / wgridsize)
while i*wgridsize < @bound[1].y
start = @canvasPoint [@bound[0].x,i*wgridsize]
end = @canvasPoint [@bound[1].x, i*wgridsize]
path = new paper.Path()
path.strokeColor = color
path.moveTo start
path.lineTo end
i++
drawAxis: (color) ->
# x axis # x axis
path = new paper.Path() path = new paper.Path()
path.strokeColor = '#BBBBBB' path.strokeColor = color
start = @canvasPoint [@bound[0].x, 0] start = @canvasPoint [@bound[0].x, 0]
end = @canvasPoint [@bound[1].x, 0] end = @canvasPoint [@bound[1].x, 0]
path.moveTo(start) path.moveTo(start)
path.lineTo(end) path.lineTo(end)
# y axis # y axis
path = new paper.Path() path = new paper.Path()
path.strokeColor = '#BBBBBB' path.strokeColor = color
start = @canvasPoint [0, @bound[0].y] start = @canvasPoint [0, @bound[0].y]
end = @canvasPoint [0, @bound[1].y] end = @canvasPoint [0, @bound[1].y]
path.moveTo(start) path.moveTo(start)
path.lineTo(end) path.lineTo(end)
@drawPoint [0,0], color, 3
prepare: () ->
ctx = @el.getContext "2d"
ctx.translate @base.x, @base.y
ctx.canvas.width = @width
ctx.canvas.height = @height
paper.setup @el
#tool = new paper.Tool()
#hitOptions = {
# segments: true,
# stroke: true,
# fill: true,
# tolerance: 5
#}
#tool.onMouseMove = (event) ->
# hitResult = paper.project.hitTest event.point, hitOptions
# return unless hitResult
# console.log hitResult
render:() -> render:() ->
# sub class responsibility # sub class responsibility
@ -57,6 +102,8 @@ class PointCloudViewer extends DataViewer
# point clound render # point clound render
render: () -> render: () ->
@drawGrid 20, "#DBDBDB" # 20 px
@drawAxis("#0A84FF")
path = new paper.Path() path = new paper.Path()
path.strokeColor = 'black' path.strokeColor = 'black'
start = null start = null
@ -67,6 +114,7 @@ class PointCloudViewer extends DataViewer
path.moveTo(start) path.moveTo(start)
else else
path.lineTo point path.lineTo point
@drawPoint v, "black", 4
paper.view.draw() paper.view.draw()

View File

@ -1 +1 @@
{"name":"LuaPlayground","root":"home://workspace/LuaPlayground","css":["css/main.css"],"javascripts":[],"coffees":["coffees/main.coffee"],"copies":["assets/scheme.html","package.json","README.md"]} {"name":"LuaPlayground","root":"home://myws/antosdk-apps/LuaPlayground","css":["css/main.css"],"javascripts":["javascripts/paper-core.min.js"],"coffees":["coffees/main.coffee"],"copies":["assets/scheme.html","package.json","README.md"]}