In a recent project, you need to use a pie chart to display the statistical results of the 'questionnaire survey '. (We used fusionchart to present the data of a column chart. It was just two years ago ), I checked the information about how fusionchart is used to display the pie chart on the Internet, but found that the information is scattered and incomplete, or I did not clearly explain its usage. I went to the fusionchart official website to see it, in English, and the deom project is too big to be patient, I finally found out the previous project and found it out, now I want to write out the methods and experience of using fusionchart to Display Dynamic Data of bar charts and pie charts. I hope it will be helpful to anyone who needs to develop Web applications, this is also a summary-for future use, easy to view!
1 <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> 2 <HTML xmlns =" http://www.w3.org/1999/xhtml "> 3The above is the use of the front-end page. It can be seen that the usage is very simple. The only difference for drawing a bar chart or a pie chart is: specify different Flash files and corresponding XML format content (for details about the XML file format corresponding to each chart, refer to the official website demo ). The methods are as follows:
Setdataurl: Sets the URL of the data source, and uses the specified XML format file as the data source.
Setdataxml: Sets the XML content of the data source, and uses the specified XML format string as the data source.
(There Is A setjsondata method on the Internet. You can set a JSON object as a data source, but it should be an old version or integrated with the modified JS file. It is not found, therefore, setting a JSON object as a data source does not seem to work !)
1 using system; 2 3 namespace web_client.piechart 4 {5 public partial class XML: system. web. UI. page 6 {7 protected void page_load (Object sender, eventargs e) 8 {9 response. contenttype = "text/XML; characterset = UTF-8"; 10 response. binarywrite (New byte [] {0xef, 0xbb, 0xbf}); 11 response. write ("<chart caption = \" pie chart \ "numberprefix = \" $ \ "> <set value = \" 25 \ "label = \" Project A \ "color = \ "afd8f8 \"/> <set value = \ "17 \" label = \ "item B \" color = \ "f6bd0f \"/> <set value = \ "23 \ "label = \" item C \ "color = \" 8bba00 \ "issliced = \" 1 \ "/> <set value = \" 65 \ "label = \" item d \ "color = \" a66edd \ "/> <set value = \" 22 \ "label = \" item e \ "color = \" f984a1 \ "/> </ chart> "); 12 response. end (); 13} 14} 15}The above is the output XML format file in the background code as the data source. Note: response. contenttype = "text/XML; characterset = UTF-8"; response. binarywrite (New byte [] {0xef, 0xbb, 0xbf}); -- these two lines of code are indispensable, and their functions are:Specify the encoding of the output XML file and solve the Chinese Garbled text problem!
As follows:
So far, the usage of fusionchart has been introduced. It is relatively simple and you do not want to describe it too much in the article. If you have any unclear friends, please leave a message for me!
Chartdemo.rar
Fusionchart provides a demo for displaying dynamic data of bar charts and pie charts.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
