FusionCharts--向下钻取与单击事件

    在FusionCharts中有一种特有的方法--向下钻取，应用此方法，我们可以将任意图表转换成一个热点或链接。这样能给我们的图形带来更好的视觉效果与功能效果。

    向下钻取主要有两种方法，一种是简单简单链接，一种是图表链接。图表链接可以从图表链接到图表（有兴趣的可以自己试试，本篇就不再介绍），下面我们注意说一下简单链接与图表获取单击事件。

    使用XML文件进行设置连接：      

<?xml version="1.0" encoding="utf-8" ?>
<graph baseFont='SunSim' baseFontSize='12' caption='分析' subcaption='' yAxisMinValue='51650.1' yAxisMaxValue='71118.3' xaxisname='日期' yaxisname='数量' hovercapbg='FFECAA' hovercapborder='F47E00' formatNumberScale='0' decimalPrecision='0' showvalues='1' numdivlines='10' numVdivlines='0' shownames='1' rotateNames='1'>
  <set name='2009-10-04' value='57653' color='AFD8F8' link='Index.html'/>
  <set name='2009-10-05' value='57389' color='F6BD0F' link='j-myJS-1079'/>
  <set name='2009-10-06' value='59256' color='8BBA00'/>
  <set name='2009-10-07' value='62762' color='FF8E46'/>
  <set name='2009-10-08' value='63287' color='008E8E'/>
  <set name='2009-10-09' value='60109' color='D64646'/>
  <set name='2009-10-10' value='64653' color='8E468E'/>
  <set name='2009-10-11' value='61687' color='588526'/>
</graph>

    在XML元素中，加入link标签，如果是想跳转页面，只需要写上要跳转的页面即可。若要获取单击事件，我们可以使用link="j-myJS-1079"，其中j表示我们使用的是js，固定形式；myJS是自己前台要写的js函数名称；1079是自己要传递的参数，多个参数可以使用逗号隔开。

    前台js函数：      

<script>
        function myJS(myVar) {
            alert(myVar);          
        }       

    </script>

     其效果如下：

       

    使用json串实现单击事件也是类似，只需要在转json的过程中加入link标签，然后可以设置需要传递的参数 （部分代码，完整代码请看上篇）   

 //设置系列中的内容
            jsonBuilder.Append(""dataset": [");
            for (int i = 0; i < dt.Columns.Count - 1; i++)
            {
                //设置各系列值
                jsonBuilder.Append("{"seriesname":"");
                jsonBuilder.Append(dt.Columns[i + 1].ColumnName);
                jsonBuilder.Append("","data": [");
                for (int j = 0; j < dt.Rows.Count; j++)
                {
                    jsonBuilder.Append("{"value": "");
                    jsonBuilder.Append(dt.Rows[j][i + 1].ToString());
                    jsonBuilder.Append("" ,");
                    jsonBuilder.Append(" "link":"j-myJS-");
                    jsonBuilder.Append(dt.Columns[i + 1].ColumnName);
                    jsonBuilder.Append(",");
                    jsonBuilder.Append(dt.Rows[i][0].ToString());
                    jsonBuilder.Append(""},");

                    //jsonBuilder.Append("{"value": "");
                    //jsonBuilder.Append(dt.Rows[j][i + 1].ToString());

                    //jsonBuilder.Append(""},");
                }
                jsonBuilder.Remove(jsonBuilder.Length - 1, 1);
                jsonBuilder.Append("]},");
            }

    在往json串中添加时，需要注意添加的位置，需要设置在系列值中。

  

   小结：

      初次接触FusionCharts时，挺陌生的，尤其是在项目中应用。一方面是项目重新封装，另一方面是实际操作能力，但是随着不断的接触学习，对它的理解也不断加深，使用的熟练程度也不断提高。在这个过程中，一定要多看使用文档，会给我的理解带来极大的方便。