效果:
const drawFlag = () => { const viewBox = 1024; const poleHeight = 1000; const poleWidth = 60; const poleX = 10; const poleY = 10; const x = poleX + poleWidth; const y = poleY + poleWidth; const width = 800; const height = 600; const radian = 90; return `<svg viewBox="0 0 ${viewBox} ${viewBox}" width="50" height="50" style="margin: auto 100px"> <rect x="${poleX}" y="${poleY}" width="${poleWidth}" height="${poleHeight}" stroke="#000" /> <path d="M ${x} ${y} Q ${width/4} ${y -radian}, ${width/2} ${y} Q ${width/4*3} ${y+radian}, ${width} ${y} L ${width} ${height} Q ${width/4*3} ${height+radian}, ${width/2} ${height} Q ${width/4} ${height-radian}, ${x} ${height} Z" stroke="#000" /> </svg>`; }
标签:10,const,svg,poleWidth,旗帜,绘制,poleY,poleX From: https://www.cnblogs.com/hello-dummy/p/17910809.html