diff --git a/src/renderer/renderScene.ts b/src/renderer/renderScene.ts index 83949cf7e..64099d417 100644 --- a/src/renderer/renderScene.ts +++ b/src/renderer/renderScene.ts @@ -362,16 +362,16 @@ const highlightPoint = ( point: Point, context: CanvasRenderingContext2D, appState: InteractiveCanvasAppState, + renderAsSquare = false, ) => { context.fillStyle = "rgba(105, 101, 219, 0.4)"; + const radius = LinearElementEditor.POINT_HANDLE_SIZE / appState.zoom.value; - fillCircle( - context, - point[0], - point[1], - LinearElementEditor.POINT_HANDLE_SIZE / appState.zoom.value, - false, - ); + if (renderAsSquare) { + fillSquare(context, point[0], point[1], radius * 2, false); + } else { + fillCircle(context, point[0], point[1], radius, false); + } }; const renderLinearElementPointHighlight = ( context: CanvasRenderingContext2D, @@ -393,10 +393,15 @@ const renderLinearElementPointHighlight = ( element, hoverPointIndex, ); + const segmented = element.roundness + ? element.segmentSplitIndices + ? element.segmentSplitIndices.includes(hoverPointIndex) + : false + : false; + context.save(); context.translate(appState.scrollX, appState.scrollY); - - highlightPoint(point, context, appState); + highlightPoint(point, context, appState, segmented); context.restore(); };