1

Make graph scale up and down

This commit is contained in:
Alex Yatskov 2014-08-30 12:21:50 +09:00
parent 05d33e03ab
commit 943e4b0d08

View File

@ -223,20 +223,20 @@ function Column(canvas, name, params, scale, range, bounds) {
} }
this.getFillBounds = function(bounds) { this.getFillBounds = function(bounds) {
var fill = (this.value - this.range.start) / this.range.getLength(); var y1 = this.getPosFromValue(0.0);
var height = bounds.height * (1.0 - goog.math.clamp(fill, 0.0, 1.0)); var y2 = this.getPosFromValue(this.value);
return new goog.math.Rect( return new goog.math.Rect(
bounds.left, bounds.left,
bounds.top + height, Math.min(y1, y2),
bounds.width - this.hintSize, bounds.width - this.hintSize,
bounds.height - height Math.abs(y1 - y2)
); );
} }
this.getHandleBounds = function(bounds, fillBounds) { this.getHandleBounds = function(bounds, fillBounds) {
var handleBounds = new goog.math.Rect( var handleBounds = new goog.math.Rect(
fillBounds.left, fillBounds.left,
fillBounds.top, this.getPosFromValue(this.value) - this.handleSize / 2,
fillBounds.width, fillBounds.width,
this.handleSize this.handleSize
); );
@ -280,18 +280,22 @@ function Column(canvas, name, params, scale, range, bounds) {
this.mouseDoubleClick = function(position) { this.mouseDoubleClick = function(position) {
if (this.isContained(position)) { if (this.isContained(position)) {
this.setClampedValue(this.getValueFromPos(position), true); this.setClampedValue(this.getValueFromPos(position.y), true);
} }
} }
this.getValueFromPos = function(position) { this.getValueFromPos = function(position) {
var percent = 1.0 - (position.y - this.columnBounds.top) / this.columnBounds.height; var percent = 1.0 - (position - this.columnBounds.top) / this.columnBounds.height;
return this.range.start + this.range.getLength() * percent; return this.range.start + this.range.getLength() * percent;
} }
this.getPosFromValue = function(value) { this.getPosFromValue = function(value) {
var percent = 1.0 - (value - this.range.start) / this.range.getLength(); var percent = 1.0 - (value - this.range.start) / this.range.getLength();
return this.columnBounds.top + this.columnBounds.height * percent; return goog.math.clamp(
this.columnBounds.top + this.columnBounds.height * percent,
this.columnBounds.top,
this.columnBounds.top + this.columnBounds.height
);
} }
this.isHovering = function(position) { this.isHovering = function(position) {
@ -309,7 +313,7 @@ function Column(canvas, name, params, scale, range, bounds) {
this.stateUpdate = function(position) { this.stateUpdate = function(position) {
switch (this.state) { switch (this.state) {
case this.State.DRAG: case this.State.DRAG:
this.setClampedValue(this.getValueFromPos(position) + this.dragDelta, false); this.setClampedValue(this.getValueFromPos(position.y) + this.dragDelta, false);
break; break;
} }
} }
@ -321,7 +325,7 @@ function Column(canvas, name, params, scale, range, bounds) {
switch (this.state) { switch (this.state) {
case this.State.DRAG: case this.State.DRAG:
this.setClampedValue(this.getValueFromPos(position) + this.dragDelta, true); this.setClampedValue(this.getValueFromPos(position.y) + this.dragDelta, true);
case this.State.HOVER: case this.State.HOVER:
if (state == this.State.NORMAL) { if (state == this.State.NORMAL) {
this.canvas.contextContainer.canvas.style.cursor = 'default'; this.canvas.contextContainer.canvas.style.cursor = 'default';
@ -331,7 +335,7 @@ function Column(canvas, name, params, scale, range, bounds) {
switch (state) { switch (state) {
case this.State.DRAG: case this.State.DRAG:
this.dragDelta = this.value - this.getValueFromPos(position); this.dragDelta = this.value - this.getValueFromPos(position.y);
case this.State.HOVER: case this.State.HOVER:
this.canvas.contextContainer.canvas.style.cursor = 'ns-resize'; this.canvas.contextContainer.canvas.style.cursor = 'ns-resize';
break; break;