0

我正在尝试计算基于以下 SVG 标记代码的 Raphael.js 形状（球体）。

通过描述，我在基本的类似球体风格上取得了成功：

  Paper.circle(100, 100, 30).attr({ fill: "r(0.35, 0.25)#FFFFFF-#252525:96-#000000", stroke: "none"});
  // radius is 30

但我不能完全重新出现。---> [图片]

** The tag code of sphere ... main part is extracted **
<g id="layer1">

 <radialGradient id="path5725_3_" cx="156.0352" cy="657.6802" r="200.0004" 
  gradientTransform="matrix(1.0404 0.7962 0.8145 -1.0643 -531.7884 745.2471)" 
  gradientUnits="userSpaceOnUse">

  <stop  offset="0" style="stop-color:#FFFFFF"/>
  <stop  offset="1" style="stop-color:#000000"/>
 </radialGradient>

 <path id="path5725" fill="url(#path5725_3_)" d="M445.037,229.105c0,113.218-89.543,205-200,205c-110.457,
  0-200-91.782-200-205s89.543-205,200-205C355.494, 24.105,445.037,115.887,445.037,229.105z"/>

</g>
** ---------------------------------------- **

这里链接了完整的标签代码图片。

如何描述（修改）Raphael.js 代码以重现图片？

谢谢你。

4

1 回答 1

0

径向渐变有两组属性来控制渐变的渲染方式。

  • cx并cy设置渐变的中心。（渐变圆的中心在哪里）
  • fx并fy设置渐变的焦点（即 offset="0" 所在的位置）。

径向渐变的 cx,cy 和 fx,fy 属性

要获得您所追求的渐变，您需要设置cx和cy。然而，Raphael 的渐变使用fxandfy代替。当cx和cy未指定时，它们默认为元素的中心。

不幸的是，据我所见，您似乎无法超越拉斐尔的行为。

于 2013-11-06T21:49:12.583 回答