Sign in to follow this  
Sanjukta

Present the data XML to table format, HTML or flash either way is ok

Recommended Posts

I have following XML data. Is there a javascript function to drag the Categories, dataset and Legend elements from it?

I want to use the data to build a html table, or is there a simple flash lib to present the table under the graph? I have tried the SSGrid.swf, but it seems doesn't work for following XML.

<chart caption="Top 10 Statements (Highest % of Slightly Agree / Agree / Strongly Agree) - All Staff Levels" rotateValues="1" placeValuesInside="1" palette="1" shownames="1" showYAxisValues="0" showvalues="0" numberPrefix="" numberSuffix="%25" showSum="1" decimals="1" showShadow="1" chartRightMargin="10" chartLeftMargin="30" exportEnabled="1" exportAtClient="1" exportHandler="fcExporter1">

- <categories>
  <category name="My immediate manager/supervisor listens to and understands my opinion. (4.39)" />
  <category name="Fusion Chart Company provides an equal opportunity environment (i.e. a working environment free from sex, race, religion, marital status, pregnancy, family status or disability discrimination) for employees." />
  <category name="My immediate manager/supervisor gives clear directions to enable me to do my job well. (3.86)" />
  <category name="My immediate manager/supervisor has enough functional / operational knowledge. (4.85)" />
  <category name="My immediate manager/supervisor transfers knowledge and skills effectively. (5.01)" />
  <category name="My immediate manager/supervisor is fair to all in our department. (4.39)" />
  <category name="My immediate manager/supervisor shows respect to his/her subordinates. (4.21)" />
  <category name="Top Management shows respect to staff at all levels in the Company. (3.86)" />
  <category name="My department management shows respect to staff at all levels in the department. (4.85)" />
  <category name="My immediate superior holds regular meetings with me to discuss my work and progress. (5.01)" />
  </categories>
- <dataset seriesName="Slightly Agree" color="C38EC7" showvalues="1">
  <set value="28.6" showValue="1" />
  <set value="27.3" showValue="1" />
  <set value="28.7" showValue="1" />
  <set value="20.9" showValue="1" />
  <set value="25.4" showValue="1" />
  <set value="13.9" showValue="1" />
  <set value="22.1" showValue="1" />
  <set value="15.9" showValue="1" />
  <set value="12.3" showValue="1" />
  <set value="11.8" showValue="1" />
  </dataset>
- <dataset seriesName="Agree" color="F87431" showvalues="1">
  <set value="54.3" showValue="1" />
  <set value="47.7" showValue="1" />
  <set value="50.4" showValue="1" />
  <set value="36.2" showValue="1" />
  <set value="26.7" showValue="1" />
  <set value="14.3" showValue="1" />
  <set value="14.2" showValue="1" />
  <set value="16.1" showValue="1" />
  <set value="20.2" showValue="1" />
  <set value="19.3" showValue="1" />
  </dataset>
- <dataset seriesName="Strongly Agree" color="347C17" showvalues="1">
  <set value="14.3" showValue="1" />
  <set value="14.2" showValue="1" />
  <set value="2.1" showValue="1" />
  <set value="16.1" showValue="1" />
  <set value="20.2" showValue="1" />
  <set value="41.9" showValue="1" />
  <set value="32.9" showValue="1" />
  <set value="36.5" showValue="1" />
  <set value="35.2" showValue="1" />
  <set value="36.4" showValue="1" />
  </dataset>
- <styles>
- <definition>
  <style name="MyFirstFontStyle" type="font" face="Verdana" size="16" color="000000" bold="1" bgColor="" />
  <style name="DataLabelFontStyle" type="font" face="Verdana" size="11" color="000000" bold="1" bgColor="" isHTML="1" />
  </definition>
- <application>
  <apply toObject="Caption" styles="MyFirstFontStyle,MyFirstShadow" />
  <apply toObject="DataLabels" styles="DataLabelFontStyle" />
  </application>
  </styles>
  </chart>
 

Share this post


Link to post
Share on other sites

Hi,

Is there a javascript function to drag the Categories, dataset and Legend elements from it?

Could you please specify the issue a bit elaborately?

Also, in case you wish to add the drag-able feature to the legends, please try setting the attribute legendAllowdrag to '1' in the <chart> element.

I am afraid, FusionCharts does not support the drag-able feature for the <categories> and <dataset> element, as of now. :)

Hope this helps. :)

Share this post


Link to post
Share on other sites

Sorry, I don't mean the drag the elements in the chart, I want to present the data in table format, and if the Fusionchart lib can present the table format, I will not create the html table by my self.

Share this post


Link to post
Share on other sites

Hi Gangadhar,

iam using MSLine for my trends, since i was loading huge data . chart in unable to render....it was showing error....plz refer t screenshot

I am afraid, FusionCharts does not support rendering of charts with very large amount of data, as of now. :)

The amount of data plots is chart specific. It is different for different charts.

For example, Line charts support about 1000 data plots, Column Charts support about 500 data plots. But if the number of data plot exceeds to 5000 or 10000, then Fuisoncharts does not support that.

Please feel free to revert in case you have further queries.

Edited by Guest

Share this post


Link to post
Share on other sites

Hi,

The question is simple:

I have a stacked 2d Bar chart, is it possible to present the data in a table format under it?

Sorry, I don't mean the drag the elements in the chart, I want to present the data in table format, and if the Fusionchart lib can present the table format, I will not create the html table by my self.

 

I am afraid, the StackBar2D chart of the FusionCharts suite does not support the grid component, as of now. :)

Edited by Guest

Share this post


Link to post
Share on other sites

thx for ur quick reply, please let me know is there any other way we can show some data at a time and remaining on some request ....or some thing like pagination....else plz let me know exact data that can me supported by ms line chart....

 

 

 

Regards

 

Ganga

Share this post


Link to post
Share on other sites

Hi Gangadhar,

To render the Multi Series Line2D chart, the number of data plots that can be mentioned in the chart has to be within 2000 when features like shadow, animation or tooltip is not applied,.

In case, features like shadow, tooltip and animation is applied, then the number of data plots cannot exceed 1000.

Hope this helps. :)

Share this post


Link to post
Share on other sites

thx for ur reply,

 

 

 

iam able to render the graph with 7000 records, just need to reconfirm what could be the max limit , without stopping to render the page.(pagination stuff....is possible here???)

 

 

 

Need one more help.

 

 

 

strangely , i have 3 trends that i need to show it by using MS Line . X axis i need to show date/time ,y axis values need to be populated.

 

but some cases x axis values are different for 3 trends .(its data/time is different for all 3 , since we need to have something in common for populating multi line graph), data is populating wrong chart since i dont have common x axis values.

 

 

 

 

 

example:

 

 

 

server values time

 

server1 10 2pm

 

server1 20 3pm

 

server1 10 4pm

 

 

 

server2 30 2pm

 

server2 40 5pm

 

server2 55 7pm

 

 

 

server3 44 2pm

 

server3 44 5pm

 

server3 4 9pm

 

server3 55 11 pm

 

 

 

Note : times are different for all servers.

 

 

 

Please let me know by any means we can populate these charts.(suggest me any chart which goes with my requirement)

 

 

 

Thx in advance.

 

 

 

 

 

Regards

 

Gangadhar

Share this post


Link to post
Share on other sites

thx for ur reply,

 

 

 

Need some help on the below:

 

 

 

1.can we connect this scattered dots with line..

 

2.x axis values are dynamic ( not known what will be populated .....always dynamic) , getting date+time , how can i convert this into integer.

 

(since we need to give some range in x axis ie integer values)

 

 

 

Thanks in advance.

 

 

 

Regards

 

Ganga

Share this post


Link to post
Share on other sites

Hi Gangadhar,

1.can we connect this scattered dots with line..

Could you please try using the atrribute drawLine='1' in the <dataset> element?

This attribute helps to configure any <dataset> element to connect the scatter points using lines.

2.x axis values are dynamic ( not known what will be populated .....always dynamic) , getting date+time , how can i convert this into integer.

(since we need to give some range in x axis ie integer values)

FusionCharts only accepts numbers as X-axis values but as of now natively do not provide any method to convert the date into integer. But every scripting language provides a specific method using which you can get a integer equivalence of a date. Please look for the specific function that nedds to be invoked into your code for the necessary conversion. Additionally you can provide a string display value for each X-axis category which can be the string representation of the date.

Hope this helps. :)

Share this post


Link to post
Share on other sites

really it was helpfull , thx alot trend line is working....

 

 

 

 

 

Please clarify :

 

1. iam generating X Axis values dynamically , since these values are different from server to another ( need t populate 2 server data, dates are different from one server t anoter.

 

ex:

 

server 1 4pm t0 10pm

 

server2 2 pm to 12pm

 

serer 3 3 am to 11am

 

 

 

in this case how i need to set x axis values( assuming that converting date to integer....)

 

 

 

2.is there any way in fusion charts that need to handle "no data found"

 

-- i need to invoke my function when it returns me no data found.....how can i handle these.....

 

ex :code

 

reportUrl = uri + "/trend?" + param;

 

var myChart = new FusionCharts("SWFcharts/MSLine.swf", "myChartId", "1100",

 

"350", "0", "1");

 

myChart.setDataURL(reportUrl);

 

myChart.render("chartdiv");

 

 

 

Thanks in advance.

Share this post


Link to post
Share on other sites

1. Yes, you need to convert date into a long type number. May i know if you are using any server side script (if yes what) to generate the XML?

 

 

 

 

 

 

 

2. You can track events defining functions - FC_NoDataToDisplay or FC_DataXMLInvalid or FC_DataLoadError.

 

 

 

c.f. http://www.fusioncharts.com/docs/Contents/JS_Events.html

 

 

 

FC_DataLoaded(DOMId) When the data of the chart has finished loading - both in dataXML or dataURL method. To further process data in any other components in your page.

 

FC_DataLoadError(DOMId) When there was an error in loading data from the specified URL To show an error message to user, or to take a corrective measure

 

FC_NoDataToDisplay(DOMId) When the XML data loaded by chart didn't contain any data to display To show an error message to user, or to take a corrective measure

 

FC_DataXMLInvalid(DOMId)

Share this post


Link to post
Share on other sites

i use normal java (written util which generates the xml for fusion charts + java script for invoking this....)

 

 

 

 

 

any tools available in fusion charts that convert date (format dd:mm:yyyy hh:mm:ss) to integer for plotting in x axis.....

 

 

 

Regards

 

Ganga

Share this post


Link to post
Share on other sites
stung (5/28/2010)
I have following XML data. Is there a javascript function todrag the Categories, dataset and Legend elements from it?

 

I want to use the data to build a html table, or is there a simple flash lib to present the table under the graph? I have tried the SSGrid.swf, but it seems doesn't work for following XML.

 

 

 

Hey, I think I have something ready for you that can pull out the data (dataset) values as a 2d javascript array. Have a look at http://www.shamasis.net/2009/11/convert-fusioncharts-data-xml-to-javascript-array/.

 

 

 

Now for pulling out categories (legends) I think I can give you the following JS code that will also return an array of categories.

 

 

 

getCategoriesFromFusionChartsXML = function(sourceXML) {

   // validate innput argument type

   if(typeof sourceXML != "string") {

       throw "ArgumentException() :: sourceXML is not string.";

   }

   var r = []; // array to store results

   // parse set elements to retrieve values

   var a = sourceXML.replace(/<category.*?sname='(.*?)'|<category.*?sname="(.*?)"/ig,

      function($1, $2, $3) { r.push($2 || $3); });

  return r;

};

 

 

 

I wrote this JS on-the-fly. If it does not work, let me know, I will test it Monday up.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this