如何内红色矩形

-1

这里提出这个多边形是小提琴 - https://jsfiddle.net/Ldvj15dk/1/

谁不工作创造了这个树图，现在我需要如下显示移动这个多边形这名雇员..但我不确定这样做的最简单方法是什么...

我应该做些什么改变来将这个多边形转换成三角形，如图片中所示？

<svg width="100%" height="510"> 
 
\t <g transform="translate(650,150)"> 
 
\t \t <g transform="translate(0,100)"> 
 
\t \t \t <g> 
 
\t \t \t \t <rect x="-150" y="-14.9" width="300" height="30" style="fill: blue"/> 
 
\t \t \t \t <text dx="-135" dy="0.3" text-anchor="start" style="fill: white"> 
 
\t \t \t \t \t <tspan x="-10" dy="0.3em">Test Node</tspan> 
 
\t \t \t \t </text> 
 
\t \t \t </g><g> 
 
\t \t \t \t <rect x="125" y="-15" width="25" height="30" style="fill: red;"/> 
 
\t \t \t \t <polygon points="9.7,8.814 9.7,8.902 8.15,8.082 8.15,6.31 6.912,6.31 6.912,3.98 8.975,3.98 8.975,0 4.025,0 4.025,3.98 6.088,3.98 6.088,6.31 4.85,6.31 4.85,8.104 3.3,8.916 3.3,8.814 0,8.814 0,12 3.3,12 3.3,9.82 4.85,9.01 4.85,9.494 8.15,9.494 8.15,8.99 9.7,9.811 9.7,12 13,12 13,8.814 " style="fill: yellow;"/> 
 
\t \t \t </g> 
 
\t \t </g> 
 
\t </g> 
 
</svg>

我想使它看起来像这样，

http://image.prntscr.com/image/0b3cdab34bbc4fc5a27ffaa3f67ceb43.png

来源

2017-01-13 Mathematics

[拖拽元素和Resizables在SVG（的可能的复制http://stackoverflow.com/questions/3614200/draggables-and-resizables -in-svg） –

是的，这是可能的。 – ntgCleaner

由于OP请求对非现场资源提出建议，因此被标记为脱离主题。 – Jayx

的最简单和最懒的解决方案是简单地转换多边形到所需的位置。下面是（使用幻数）的一个例子：

<svg width="100%" height="200"> 
 
\t <g transform="translate(150,50)"> 
 
\t \t <g transform="translate(0,0)"> 
 
\t \t \t <g> 
 
\t \t \t \t <rect x="-150" y="-14.9" width="300" height="30" style="fill: blue"/> 
 
\t \t \t \t <text dx="-135" dy="0.3" text-anchor="start" style="fill: white"> 
 
\t \t \t \t \t <tspan x="-10" dy="0.3em">Test Node</tspan> 
 
\t \t \t \t </text> 
 
\t \t \t </g><g> 
 
\t \t \t \t <rect x="125" y="-15" width="25" height="30" style="fill: red;"/> 
 
\t \t \t \t <polygon transform="translate(130,-4)" points="9.7,8.814 9.7,8.902 8.15,8.082 8.15,6.31 6.912,6.31 6.912,3.98 8.975,3.98 8.975,0 4.025,0 4.025,3.98 6.088,3.98 6.088,6.31 4.85,6.31 4.85,8.104 3.3,8.916 3.3,8.814 0,8.814 0,12 3.3,12 3.3,9.82 4.85,9.01 4.85,9.494 8.15,9.494 8.15,8.99 9.7,9.811 9.7,12 13,12 13,8.814 " style="fill: yellow;"/> 
 
\t \t \t </g> 
 
\t \t </g> 
 
\t </g> 
 
</svg>

来源

2017-01-13 14:49:54

如何内红色矩形

回答

相关问题