Cur*_*arn 4 javascript raphael
请参阅下面的代码.我试图在路径周围绘制一个圆圈(由Raphael.js创始人Dimitry制作的图标),然后用一种颜色填充圆圈.然而,这是在路径的顶部.如果我可以先绘制实心圆然后绘制路径,这将得到解决.但是我需要引用路径,因为我需要找到它的中心,以便绘制圆圈.任何人都可以建议如何做到这一点?我的代码如下.
谢谢.
<script>
var myVar = {
s: 1,
pw: 850,
ph: 450
}
</script>
<script>
var paper = new Raphael('figSellerBuyer', myVar.pw * myVar.s, myVar.ph * myVar.s);
var market = paper.path(paths.marketBoundary);
market.attr({fill: "rgb(75,245,75)", stroke: "None"});
var humanIcon = paper.path("M21.021,16.349c-0.611-1.104-1.359-1.998-2.109-2.623c-0.875,0.641-1.941,1.031-3.103,1.031c-1.164,0-2.231-0.391-3.105-1.031c-0.75,0.625-1.498,1.519-2.111,2.623c-1.422,2.563-1.578,5.192-0.35,5.874c0.55,0.307,1.127,0.078,1.723-0.496c-0.105,0.582-0.166,1.213-0.166,1.873c0,2.932,1.139,5.307,2.543,5.307c0.846,0,1.265-0.865,1.466-2.189c0.201,1.324,0.62,2.189,1.463,2.189c1.406,0,2.545-2.375,2.545-5.307c0-0.66-0.061-1.291-0.168-1.873c0.598,0.574,1.174,0.803,1.725,0.496C22.602,21.541,22.443,18.912,21.021,16.349zM15.808,13.757c2.362,0,4.278-1.916,4.278-4.279s-1.916-4.279-4.278-4.279c-2.363,0-4.28,1.916-4.28,4.279S13.445,13.757,15.808,13.757z")
humanIcon.attr({fill: "rgb(75,75,75)"}).scale(2.5,2.5);
humanIcon.translate(40,40);
var bbox = humanIcon.getBBox();
var xcenter = Math.round(bbox.x + bbox.width/2.0);
var ycenter = Math.round(bbox.y + bbox.height/2.0);
var circle = paper.circle(xcenter, ycenter, 40);
circle.attr({fill:"white"});
</script>
Run Code Online (Sandbox Code Playgroud)
在Google上进行了大量搜索之后,我在Stackoverflow上找到了答案.当时,我没有保存答案的链接,我不记得了.如果有人找到它,请编辑此答案并发布.但是,我确实记录了解决方案,这里是:
人们可以在Raphael中使用insertBefore()和insertAfter()功能.在问题中给出的示例代码中,可以通过将最后一行更改为:
circle.attr({fill:"white"}).insertBefore(humanIcon);
Run Code Online (Sandbox Code Playgroud)
感谢那些回应的人.
| 归档时间: |
|
| 查看次数: |
5031 次 |
| 最近记录: |