FusionChart图表控件 点击事件(XML和JSON作为数据源时的分别处
发布时间:2020-12-16 06:29:48 所属栏目:百科 来源:网络整理
导读:1、JSON作为数据源时: @{ Layout = null; } !DOCTYPE html html head meta name="viewport" content="width=device-width" / titleInChart/title script src="~/Scripts/jquery-1.8.2.min.js"/script script src="~/Scripts/FusionChartsV3.2/FusionCharts.
1、JSON作为数据源时: @{ Layout = null;} <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>InChart</title> <script src="~/Scripts/jquery-1.8.2.min.js"></script> <script src="~/Scripts/FusionChartsV3.2/FusionCharts.js"></script> </head> <body> <div> <div id="chartdiv" align="center"></div> <script type="text/javascript"> var MyChart = new FusionCharts("../Scripts/FusionChartsV3.2/Bar2D.swf","MyChart1","1200","600"); MyChart.setJSONData({ "chart": { "caption": "My Test Caption", "subcaption": "", "yaxisname": "Quantity", "xaxisname": "包装箱号", "alternatevgridcolor": "AFD8F8", "basefontcolor": "114B78", //"tooltipbordercolor": "114B78", //"tooltipbgcolor": "E7EFF6", "useroundedges": "1", "showborder": "1", "bgcolor": "FFFFFF", "numbersuffix": "M", //"palettecolors": "#AFD8F8,#F6BD0F,#8BBA00,#A66EDD,#F984A1" "palettecolors": "#8BBA00", "baseFontSize": "15", "alternateVGridColor": "99FF00" }, "data": [ { "label": "Orange", "value": "23", "link": "j-ClickAction-23" }, { "label": "Apple", "value": "12", "link": "j-ClickAction-12" }, { "label": "Banana", "value": "17", "link": "j-ClickAction-17" }, { "label": "Mango", "value": "14", "link": "j-ClickAction-14" }, { "label": "Litchi", "link": "j-ClickAction-12" } ] }); MyChart.render("chartdiv"); function ClickAction(myVar) { window.alert(myVar); } </script> </div> </body> </html> 2、XML作为数据源时: 在拼写加载chart时使用的xml文件时,在<setlabel="Orange"value="23">中添加link='j-ClickAction-23', 即<setlabel="Orange"value="23"link='j-ClickAction-23'>; ********************************************************************************************************************************************************************************* 解释: 其中,j代表调用的是js,ClickAction代表你前台页面上要调用的js方法名,23代表前台js方法ClickAction需要的参数。
效果如图:
(编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |