diff options
| -rw-r--r-- | src/client/views/DocumentDecorations.tsx | 29 |
1 files changed, 15 insertions, 14 deletions
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index be9ab7960..a615d8b26 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -463,25 +463,26 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P if (useRotation && docView) { const inkData = Cast(SelectionManager.Views().lastElement().rootDoc.data, InkField)?.inkData ?? [{ X: 0, Y: 0 }]; const inkDoc = SelectionManager.Views().lastElement().layoutDoc; + const swidth = docView.screenToLocal().inverse().transformDirection(NumCast(seldoc.props.Document.strokeWidth, 1), NumCast(seldoc.props.Document.strokeWidth, 1)); const points = inkData.map((point) => docView.screenToLocal().inverse().transformPoint(point.X, point.Y)).map(p => ({ X: p[0], Y: p[1] })); - const strokeWidth = 4; - const lineTop = Math.min(...points.map(p => p.Y)); - const lineBottom = Math.max(...points.map(p => p.Y)); - const lineLeft = Math.min(...points.map(p => p.X)); - const lineRight = Math.max(...points.map(p => p.X)); - const left = lineLeft - strokeWidth / 2; - const top = lineTop - strokeWidth / 2; - const right = lineRight + strokeWidth / 2; - const bottom = lineBottom + strokeWidth / 2; + const strokeWidth = 1; + const lineTop = Math.min(...points.map(p => p.Y)) - swidth[0] / 2; + const lineBottom = Math.max(...points.map(p => p.Y)) + swidth[0] / 2; + const lineLeft = Math.min(...points.map(p => p.X)) - swidth[0] / 2; + const lineRight = Math.max(...points.map(p => p.X)) + swidth[0] / 2; + const left = lineLeft; + const top = lineTop; + const right = lineRight; + const bottom = lineBottom; const width = Math.max(1, right - left); const height = Math.max(1, bottom - top); - const scaleX = width === strokeWidth ? 1 : (this.props.PanelWidth - strokeWidth) / (width - strokeWidth); - const scaleY = height === strokeWidth ? 1 : (this.props.PanelHeight - strokeWidth) / (height - strokeWidth); + const scaleX = width === strokeWidth ? 1 : (bounds.r - bounds.x) / (width - strokeWidth); + const scaleY = height === strokeWidth ? 1 : (bounds.b - bounds.y) / (height - strokeWidth); selectedLine = InteractionUtils.CreatePolyline(points, left, top, Colors.MEDIUM_BLUE, strokeWidth, strokeWidth, StrCast(inkDoc.strokeBezier), StrCast(inkDoc.fillColor, "none"), - StrCast(inkDoc.strokeStartMarker), StrCast(inkDoc.strokeEndMarker), StrCast(inkDoc.strokeDash), 1, 1, "", "none", 1.0, false); + StrCast(inkDoc.strokeStartMarker), StrCast(inkDoc.strokeEndMarker), StrCast(inkDoc.strokeDash), scaleX, scaleY, "", "none", 1.0, false); } return (<div className="documentDecorations" style={{ background: CurrentUserUtils.ActiveDashboard?.darkScheme ? "dimgray" : "" }} > @@ -526,8 +527,8 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P </div > <div className="documentDecorations-inkstroke" style={{ position: "absolute", - width: (bounds.r - bounds.x + this._resizeBorderWidth) + "px", - height: (bounds.b - bounds.y + this._resizeBorderWidth) + "px", + width: (bounds.r - bounds.x) + "px", + height: (bounds.b - bounds.y) + "px", left: bounds.x, top: bounds.y, overflow: "visible", |