Added basic zoom-recenter
This commit is contained in:
2
dist/js/bundle.js
vendored
2
dist/js/bundle.js
vendored
File diff suppressed because one or more lines are too long
@@ -20,14 +20,25 @@ class EnvironmentController extends CanvasController{
|
|||||||
const el = document.querySelector('#env-canvas');
|
const el = document.querySelector('#env-canvas');
|
||||||
el.onwheel = function zoom(event) {
|
el.onwheel = function zoom(event) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
|
||||||
var sign = -1*Math.sign(event.deltaY);
|
var sign = -1*Math.sign(event.deltaY);
|
||||||
|
|
||||||
|
var cur_top = parseInt($('#env-canvas').css('top'));
|
||||||
|
var cur_left = parseInt($('#env-canvas').css('left'));
|
||||||
|
var diff_x = ((-cur_left/this.scale+this.canvas.width/2) - this.mouse_x)*this.scale/2*sign;
|
||||||
|
var diff_y = ((-cur_top/this.scale+this.canvas.height/2) - this.mouse_y)*this.scale/2*sign;
|
||||||
|
$('#env-canvas').css('top', (cur_top+diff_y)+'px');
|
||||||
|
$('#env-canvas').css('left', (cur_left+diff_x)+'px');
|
||||||
|
|
||||||
// Restrict scale
|
// Restrict scale
|
||||||
scale = Math.max(0.5, scale+(sign*zoom_speed));
|
scale = Math.max(0.5, this.scale+(sign*zoom_speed));
|
||||||
|
|
||||||
// Apply scale transform
|
// Apply scale transform
|
||||||
el.style.transform = `scale(${scale})`;
|
el.style.transform = `scale(${scale})`;
|
||||||
this.scale = scale;
|
this.scale = scale;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}.bind(this);
|
}.bind(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -45,6 +56,8 @@ class EnvironmentController extends CanvasController{
|
|||||||
|
|
||||||
mouseMove() {
|
mouseMove() {
|
||||||
this.performModeAction();
|
this.performModeAction();
|
||||||
|
var cur_top = parseInt($('#env-canvas').css('top'))/this.scale;
|
||||||
|
var cur_left = parseInt($('#env-canvas').css('left'))/this.scale;
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseDown() {
|
mouseDown() {
|
||||||
|
|||||||
Reference in New Issue
Block a user