ilia.gurielidze/scada_device_layout
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix EPC rendering: thicker line, consistent strokes, correct end rotation

Browse Source 
- Increase EPC line width from 0.4 to 1.5 for visibility
- Increase right box stroke from 0.3 to 1.0 to match left icon stroke
- Fix right box to extend behind last waypoint (like left icon), not forward

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
igurielidze 2026-03-30 15:11:09 +04:00
parent db19535f39
commit c9a8dd8f5b
5 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
svelte-app/src/lib/canvas/collision.ts
View File

@ -405,7 +405,7 @@ function getEpcCollisionQuads(
ox + last.x, oy + last.y, ox + last.x, oy + last.y,
last.x - prev.x, last.y - prev.y, last.x - prev.x, last.y - prev.y,
EPC_CONFIG.rightBox.w, EPC_CONFIG.rightBox.h, EPC_CONFIG.rightBox.w, EPC_CONFIG.rightBox.h,
'left' 'right'
); );
if (rbQ.length === 4) quads.push(rbQ); if (rbQ.length === 4) quads.push(rbQ);

2
svelte-app/src/lib/canvas/interactions.ts
View File

@ -361,7 +361,7 @@ function recalcEpcBounds(sym: typeof layout.symbols[0]) {
const last = wps[wps.length - 1]; const last = wps[wps.length - 1];
const prev = wps[wps.length - 2]; const prev = wps[wps.length - 2];
const rbDir = { x: last.x - prev.x, y: last.y - prev.y }; const rbDir = { x: last.x - prev.x, y: last.y - prev.y };
const rbCorners = orientedBoxCorners(last.x, last.y, rbDir.x, rbDir.y, EPC_CONFIG.rightBox.w, EPC_CONFIG.rightBox.h, 'left'); const rbCorners = orientedBoxCorners(last.x, last.y, rbDir.x, rbDir.y, EPC_CONFIG.rightBox.w, EPC_CONFIG.rightBox.h, 'right');
for (const [bx, by] of rbCorners) { for (const [bx, by] of rbCorners) {
minX = Math.min(minX, bx); minY = Math.min(minY, by); minX = Math.min(minX, bx); minY = Math.min(minY, by);
maxX = Math.max(maxX, bx); maxY = Math.max(maxY, by); maxX = Math.max(maxX, bx); maxY = Math.max(maxY, by);

2
svelte-app/src/lib/canvas/render-theme.ts
View File

@ -55,7 +55,7 @@ export const THEME = {
lineColor: '#000000', lineColor: '#000000',
rightBoxFill: '#aaaaaa', rightBoxFill: '#aaaaaa',
rightBoxStroke: '#000000', rightBoxStroke: '#000000',
rightBoxStrokeWidth: 0.3, rightBoxStrokeWidth: 1.0,
}, },
induction: { induction: {
fillColor: '#000000', fillColor: '#000000',

6
svelte-app/src/lib/canvas/renderer.ts
View File

@ -186,8 +186,8 @@ function drawEpcSymbol(ctx: CanvasRenderingContext2D, sym: PlacedSymbol) {
ctx.fillStyle = THEME.epcBody.rightBoxFill; ctx.fillStyle = THEME.epcBody.rightBoxFill;
ctx.strokeStyle = THEME.epcBody.rightBoxStroke; ctx.strokeStyle = THEME.epcBody.rightBoxStroke;
ctx.lineWidth = THEME.epcBody.rightBoxStrokeWidth; ctx.lineWidth = THEME.epcBody.rightBoxStrokeWidth;
ctx.fillRect(0, -rb.h / 2, rb.w, rb.h); ctx.fillRect(-rb.w, -rb.h / 2, rb.w, rb.h);
ctx.strokeRect(0, -rb.h / 2, rb.w, rb.h); ctx.strokeRect(-rb.w, -rb.h / 2, rb.w, rb.h);
ctx.restore(); ctx.restore();
} }
} }
@ -270,7 +270,7 @@ function traceEpcOutlinePath(ctx: CanvasRenderingContext2D, sym: PlacedSymbol, p
ctx.translate(plx, ply); ctx.translate(plx, ply);
ctx.rotate(rAngle); ctx.rotate(rAngle);
ctx.beginPath(); ctx.beginPath();
ctx.rect(-pad, -rb.h / 2 - pad, rb.w + pad * 2, rb.h + pad * 2); ctx.rect(-rb.w - pad, -rb.h / 2 - pad, rb.w + pad * 2, rb.h + pad * 2);
ctx.stroke(); ctx.stroke();
ctx.restore(); ctx.restore();
} }

2
svelte-app/src/lib/symbol-config.ts
View File

@ -4,7 +4,7 @@ export const EPC_CONFIG = {
iconFile: '/symbols/epc_icon.svg', iconFile: '/symbols/epc_icon.svg',
leftBox: { x: 0, y: 0, w: 26, h: 20 }, leftBox: { x: 0, y: 0, w: 26, h: 20 },
rightBox: { w: 10, h: 20 }, rightBox: { w: 10, h: 20 },
lineWidth: 0.4, lineWidth: 1.5,
defaultWaypoints: [ defaultWaypoints: [
{ x: 26, y: 10 }, // exit from left box center-right { x: 26, y: 10 }, // exit from left box center-right
{ x: 57, y: 10 }, // entry to right box center-left { x: 57, y: 10 }, // entry to right box center-left