import { Point } from 'roughjs/bin/geometry' ; import { RenderMode } from '../RenderMode' ; import { RenderContext , getPointsArray , applyMatrix , postProcessElement , parseStyleConfig , applyGlobalTransform } from '../utils' ; import { drawMarkers } from './marker' ; export function drawPolygon ( context , polygon , svgTransform ) { const points = getPointsArray ( polygon ) ; const transformed = points . map ( p => { const pt = applyMatrix ( p , svgTransform ) ; return [ pt . x , pt . y ] as Point ; } ) ; const polygonSketch = context . rc . polygon ( transformed , parseStyleConfig ( context , polygon , svgTransform ) ) ; postProcessElement ( context , polygon , polygonSketch ) ; if ( points . length > 0 ) { points . push ( points [ 0 ] ) ; drawMarkers ( context , polygon , points , svgTransform ) ; } } export function applyPolygonClip ( context , polygon , container , svgTransform ) { const targetCtx = context . targetCanvasContext ; if ( context . renderMode === RenderMode . CANVAS && targetCtx ) { const points = getPointsArray ( polygon ) ; if ( points . length > 0 ) { targetCtx . save ( ) ; applyGlobalTransform ( context , svgTransform ) ; const startPt = points [ 0 ] ; targetCtx . moveTo ( startPt . x , startPt . y ) ; for ( let i = 1 ; i < points . length ; i ++ ) { const pt = points [ i ] ; targetCtx . lineTo ( pt . x , pt . y ) ; } targetCtx . closePath ( ) ; targetCtx . restore ( ) ; } } else { const clip = document . createElementNS ( 'http://www.w3.org/2000/svg' , 'polygon' ) ; clip . setAttribute ( 'points' , polygon . getAttribute ( 'points' ) ! ) ; applyGlobalTransform ( context , svgTransform , clip ) ; container ! . appendChild ( clip ) ; } }