lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-06-28 15:23:44 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Use another approach for unscaled strokes.

Browse Source
This commit is contained in:
MaxGraey 2018-03-19 19:32:28 +02:00
parent 4d3762f48d
commit 87e1e329f6
3 changed files with 47 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
konva.js
View File

@ -2,7 +2,7 @@
* Konva JavaScript Framework v2.0.2 * Konva JavaScript Framework v2.0.2
* http://konvajs.github.io/ * http://konvajs.github.io/
* Licensed under the MIT * Licensed under the MIT
* Date: Sat Mar 17 2018 * Date: Mon Mar 19 2018
* *
* Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS) * Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
* Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva) * Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva)
@ -2070,12 +2070,12 @@
shape.getStrokeScaleEnabled() || shape instanceof Konva.Text; shape.getStrokeScaleEnabled() || shape instanceof Konva.Text;
if (shape.hasStroke()) { if (shape.hasStroke()) {
if (!strokeScaleEnabled) { /* if (!strokeScaleEnabled) {
this.save(); this.save();
var pixelRatio = this.getCanvas().getPixelRatio(); var pixelRatio = this.getCanvas().getPixelRatio();
var transform = this._context.currentTransform; var transform = this._context.currentTransform;
this.setTransform(pixelRatio, transform.b, transform.c, pixelRatio, transform.e, transform.f); this.setTransform(pixelRatio, transform.b, transform.c, pixelRatio, transform.e, transform.f);
} } */
this._applyLineCap(shape); this._applyLineCap(shape);
if (dash && shape.dashEnabled()) { if (dash && shape.dashEnabled()) {
@ -2083,7 +2083,13 @@
this.setAttr('lineDashOffset', shape.dashOffset()); this.setAttr('lineDashOffset', shape.dashOffset());
} }
this.setAttr('lineWidth', shape.strokeWidth()); if (!strokeScaleEnabled) {
var pixelRatio = this.getCanvas().getPixelRatio();
var scale = pixelRatio / (this._context.currentTransform ? this._context.currentTransform.a : 1);
this.setAttr('lineWidth', shape.strokeWidth() * scale);
} else {
this.setAttr('lineWidth', shape.strokeWidth());
}
if (!shape.getShadowForStrokeEnabled()) { if (!shape.getShadowForStrokeEnabled()) {
this.setAttr('shadowColor', 'rgba(0,0,0,0)'); this.setAttr('shadowColor', 'rgba(0,0,0,0)');
@ -2100,9 +2106,9 @@
shape._strokeFunc(this); shape._strokeFunc(this);
if (!strokeScaleEnabled) { /* if (!strokeScaleEnabled) {
this.restore(); this.restore();
} } */
} }
}, },
_applyShadow: function(shape) { _applyShadow: function(shape) {
@ -2152,19 +2158,25 @@
// ignore strokeScaleEnabled for Text // ignore strokeScaleEnabled for Text
var strokeScaleEnabled = var strokeScaleEnabled =
shape.getStrokeScaleEnabled() || shape instanceof Konva.Text; shape.getStrokeScaleEnabled() || shape instanceof Konva.Text;
if (!strokeScaleEnabled) { /* if (!strokeScaleEnabled) {
this.save(); this.save();
var pixelRatio = this.getCanvas().getPixelRatio(); var pixelRatio = this.getCanvas().getPixelRatio();
var transform = this._context.currentTransform; var transform = this._context.currentTransform;
this.setTransform(pixelRatio, transform.b, transform.c, pixelRatio, transform.e, transform.f); this.setTransform(pixelRatio, transform.b, transform.c, pixelRatio, transform.e, transform.f);
} } */
this._applyLineCap(shape); this._applyLineCap(shape);
this.setAttr('lineWidth', shape.strokeWidth()); if (!strokeScaleEnabled) {
var pixelRatio = this.getCanvas().getPixelRatio();
var scale = pixelRatio / (this._context.currentTransform ? this._context.currentTransform.a : 1);
this.setAttr('lineWidth', shape.strokeWidth() * scale);
} else {
this.setAttr('lineWidth', shape.strokeWidth());
}
this.setAttr('strokeStyle', shape.colorKey); this.setAttr('strokeStyle', shape.colorKey);
shape._strokeFuncHit(this); shape._strokeFuncHit(this);
if (!strokeScaleEnabled) { /* if (!strokeScaleEnabled) {
this.restore(); this.restore();
} } */
} }
} }
}; };

4
konva.min.js vendored
View File

File diff suppressed because one or more lines are too long

32
src/Context.js
View File

@ -621,12 +621,12 @@
shape.getStrokeScaleEnabled() || shape instanceof Konva.Text; shape.getStrokeScaleEnabled() || shape instanceof Konva.Text;
if (shape.hasStroke()) { if (shape.hasStroke()) {
if (!strokeScaleEnabled) { /* if (!strokeScaleEnabled) {
this.save(); this.save();
var pixelRatio = this.getCanvas().getPixelRatio(); var pixelRatio = this.getCanvas().getPixelRatio();
var transform = this._context.currentTransform; var transform = this._context.currentTransform;
this.setTransform(pixelRatio, transform.b, transform.c, pixelRatio, transform.e, transform.f); this.setTransform(pixelRatio, transform.b, transform.c, pixelRatio, transform.e, transform.f);
} } */
this._applyLineCap(shape); this._applyLineCap(shape);
if (dash && shape.dashEnabled()) { if (dash && shape.dashEnabled()) {
@ -634,7 +634,13 @@
this.setAttr('lineDashOffset', shape.dashOffset()); this.setAttr('lineDashOffset', shape.dashOffset());
} }
this.setAttr('lineWidth', shape.strokeWidth()); if (!strokeScaleEnabled) {
var pixelRatio = this.getCanvas().getPixelRatio();
var scale = pixelRatio / (this._context.currentTransform ? this._context.currentTransform.a : 1);
this.setAttr('lineWidth', shape.strokeWidth() * scale);
} else {
this.setAttr('lineWidth', shape.strokeWidth());
}
if (!shape.getShadowForStrokeEnabled()) { if (!shape.getShadowForStrokeEnabled()) {
this.setAttr('shadowColor', 'rgba(0,0,0,0)'); this.setAttr('shadowColor', 'rgba(0,0,0,0)');
@ -651,9 +657,9 @@
shape._strokeFunc(this); shape._strokeFunc(this);
if (!strokeScaleEnabled) { /* if (!strokeScaleEnabled) {
this.restore(); this.restore();
} } */
} }
}, },
_applyShadow: function(shape) { _applyShadow: function(shape) {
@ -703,19 +709,25 @@
// ignore strokeScaleEnabled for Text // ignore strokeScaleEnabled for Text
var strokeScaleEnabled = var strokeScaleEnabled =
shape.getStrokeScaleEnabled() || shape instanceof Konva.Text; shape.getStrokeScaleEnabled() || shape instanceof Konva.Text;
if (!strokeScaleEnabled) { /* if (!strokeScaleEnabled) {
this.save(); this.save();
var pixelRatio = this.getCanvas().getPixelRatio(); var pixelRatio = this.getCanvas().getPixelRatio();
var transform = this._context.currentTransform; var transform = this._context.currentTransform;
this.setTransform(pixelRatio, transform.b, transform.c, pixelRatio, transform.e, transform.f); this.setTransform(pixelRatio, transform.b, transform.c, pixelRatio, transform.e, transform.f);
} } */
this._applyLineCap(shape); this._applyLineCap(shape);
this.setAttr('lineWidth', shape.strokeWidth()); if (!strokeScaleEnabled) {
var pixelRatio = this.getCanvas().getPixelRatio();
var scale = pixelRatio / (this._context.currentTransform ? this._context.currentTransform.a : 1);
this.setAttr('lineWidth', shape.strokeWidth() * scale);
} else {
this.setAttr('lineWidth', shape.strokeWidth());
}
this.setAttr('strokeStyle', shape.colorKey); this.setAttr('strokeStyle', shape.colorKey);
shape._strokeFuncHit(this); shape._strokeFuncHit(this);
if (!strokeScaleEnabled) { /* if (!strokeScaleEnabled) {
this.restore(); this.restore();
} } */
} }
} }
}; };