JavaScript图表工具FusionCharts入门教程(26):饼图和甜甜圈图（三）

---

FusionCharts Suite XT是全面的跨平台、跨浏览器JavaScript图表套包，其中包括FusionCharts XT、PowerCharts XT 、FusionWidgets XT 、FusionMaps XT。支持 ASP、 ASP.NET、 PHP、 JSP、 ColdFusion、 Ruby on Rails、 JavaScript、甚至简单的HTML页面。它是你值得信赖的JavaScript图表解决方案，目前在全球有45万用户选择Fusioncharts来制作专业的JavaScript图表。

点击下载FusionCharts最新版

设置起始角度

默认情况下，饼图/甜甜圈图从0°角开始绘制。该图表允许您显式设置起始角度。指定startingAngle属性设置饼图/甜甜圈图的起始角度。第一个饼图切片将从此属性中指定的角度度量开始绘制。

请参阅下面给出的代码：

{
  "chart": {
    "startingAngle": "45"
  }
}

起始角设置为45°的饼图如下所示：

切片馅饼/甜甜圈

默认情况下，当饼图/甜甜圈图首次呈现时，将切入所有切片。但是，要突出显示一个切片，您可能希望在图表首次加载时将其切成薄片。isSliced属性可用于指定饼图将被切成一切片的形式呈现。将该属性设置1为饼图切片，以呈现切出的切片。此属性属于data对象。
请参阅下面给出的代码：

{
  "data": {
    "label": "Household",
    "value": "49100",
    "isSliced": "1"
}

一片切成薄片的饼图如下所示：

配置切片距离

切出馅饼/甜甜圈切片时，您可以配置中心和切出的切片之间的距离。使用slicingDistance属性设置图表中心和切出的切片之间的距离（以像素为单位）。

请参阅下面给出的代码：

{
  "chart": {
    "slicingDistance": "10"
  }
}

配置了切片距离的图表如下所示：

配置斜角效果

对于饼图/甜甜圈图，您可以配置斜角效果以使用3D效果渲染图表。设置use3DLighting属性以1指定是否将使用高级渐变和阴影效果来创建外观更好的图表。

使用radius3D属性设置图表的3D半径。在3D照明模式下绘制图表时，使用此属性可以以百分比形式设置半径。从根本上说，它有助于设置馅饼/甜甜圈的斜角距离。

请参阅下面给出的代码：

{
  "chart": {
    "use3DLighting": "1",
    "radius3D": "50"
  }
}

为斜角效果配置的饼图如下所示：

---

想要购买FusionCharts Suite XT正版授权，或了解更多产品信息请点击