|
|
|
Forum Newbie
Group: Forum Members
Last Login: 2/28/2008 11:37:15 AM
Posts: 6,
Visits: 22
|
|
I'm looking for an example of an interactive pie chart. I want to show a pie chart on page and then the user can pull out slices and when the "Get Slices" button is selected I would to retrieve the list of the slices that were pulled out.
I would think that there are two ways to do this. First, record each slice as it is selected but if it is unselected then the slice has to removed from the list. Second, I hope that there is some way to read the chart and ask which slices are selected. I'm looking for a Javascript example.
|
|
|
|
|
Forum Newbie
Group: Forum Members
Last Login: 2/28/2008 11:37:15 AM
Posts: 6,
Visits: 22
|
|
I sort of have the example of the interactive chart working. The code is<?xml version="1.0" encoding="iso-8859-1"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Event Chart Analysis</title>
<link rel="stylesheet" href="../Contents/Style.css" type="text/css" />
<script language="JavaScript" src="../JSClass/FusionCharts.js"></script>
<script language="javascript" type="text/javascript">
var values = []; function save_value(ip){
values.push(ip);
} function show_values(){
alert("values = "+ values);
}
</script>
</head> <body> <table width="98%" border="0" cellspacing="0" cellpadding="3" align="center">
<tr>
<td valign="top" class="text" align="center"> <div id="detector_ip_div" align="center">
Detector IP</div>
<script type="text/javascript">
var chart = new FusionCharts("../Charts/Pie2D.swf", "ChartId", "310", "250", "0", "0");
chart.setDataURL("Data/Detector_ip.xml");
chart.render("detector_ip_div");
</script>
</td>
</tr>
<tr>
<td valign="top" class="text" align="center"> </td>
<td><input type="button" value="Show Selected" onclick="show_values()" />
</tr>
</table>
</body>
</html>
and the xml file (Detector_ip.xml) is: <chart palette='4'>
<set label="10.2.10.1" value="4" link='javascript:save_value("10.2.10.1")' />
<set label="10.2.10.2" value="5" link='javascript:save_value("10.2.10.2")'/>
<set label="10.2.10.3" value="2" link='javascript:save_value("10.2.10.3")'/>
<set label="10.2.10.4" value="4" link='javascript:save_value("10.2.10.4")'/>
<set label="10.2.10.5" value="5" link='javascript:save_value("10.2.10.5")' />
<set label="10.2.10.6" value="5" link='javascript:save_value("10.2.10.6")' />
<set label="10.2.10.8" value="20" link='javascript:save_value("10.2.10.8")' />
<set label="10.2.10.10" value="5" link='javascript:save_value("10.2.10.10")'/>
<set label="10.2.10.30" value="2" link='javascript:save_value("10.2.10.30")'/>
</chart>
However now that the slices have a link they no longer slide out when they are selected. How can I have both or is there some way to read the chart when the Show Selected button is clicked? 
|
|
|
|