FusionCharts 3D Dual Bar Chart-XML/RSS Tutorial-php.cn

Home

Backend Development

XML/RSS Tutorial

FusionCharts 3D Dual Bar Chart

黄舟

Feb 15, 2017 pm 03:22 PM

1. The source code of the 3D double column chart page is as follows

doubleColumn3D.html:

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>FusionCharts 3D双柱状图</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <script type="text/javascript" src="../script/jquery-1.10.2.js"></script>
        <script type="text/javascript" src="../script/Charts/FusionCharts.js"></script>
        <style type="text/css">
            body{
                width:99%;
                height:100%;
                font-size:12px;
            }
            #doubleColumn3DChart{
                width:100%;
            }
        </style>
        <script type="text/javascript">
            $(function(){
                var column3D = new FusionCharts( "../script/Charts/MSColumn3D.swf", "myChartId", "100%", "520", "0" );
                column3D.setXMLUrl("data/doubleColumn3D.xml");
                column3D.render("doubleColumn3DChart");   
            });
        </script>
    </head>
    <body>
        <p id="doubleColumn3DChart"></p>
    </body>
</html>

Copy after login

2. 3D double column chart data source

##doubleColumn3D.xml：

<?xml version="1.0" encoding="UTF-8"?>
<chart caption=&#39;2012年和2013年统计收入&#39; xAxisName=&#39;月份&#39; yAxisName=&#39;收入&#39; showValues=&#39;0&#39; baseFont=&#39;微软雅黑&#39; baseFontSize=&#39;14&#39;
       baseFontColor=&#39;#00FF00&#39; outCnvBaseFont=&#39;宋体&#39; outCnvBaseFontSize=&#39;16&#39; outCnvBaseFontColor=&#39;#798777&#39; showAboutMenuItem=&#39;1&#39;
       showLabels=&#39;1&#39; labelDisplay=&#39;ROTATE &#39; useEllipsesWhenOverflow=&#39;1&#39; rotateLabels=&#39;1&#39; slantLabels=&#39;1&#39; staggerLines=&#39;2&#39;
       labelStep=&#39;3&#39; placeValuesInside=&#39;1&#39; showYAxisValues=&#39;1&#39; showLimits=&#39;1&#39; showpLineValues=&#39;1&#39; showShadow=&#39;1&#39; adjustp=&#39;1&#39;
       setAdaptiveYMin=&#39;1&#39; centerYaxisName=&#39;1&#39; useRoundEdges=&#39;1&#39; numpLines=&#39;8&#39; pLineColor=&#39;#987989&#39; pLineIsDashed=&#39;1&#39;>

   <categories>
      <category label=&#39;一月&#39; />
      <category label=&#39;二月&#39; />
      <category label=&#39;三月&#39; />
      <category label=&#39;四月&#39; />
      <category label=&#39;五月&#39; />
      <category label=&#39;六月&#39; />
      <category label=&#39;七月&#39; />
      <category label=&#39;八月&#39; />
      <category label=&#39;九月&#39; />
      <category label=&#39;十月&#39; />
      <category label=&#39;十一月&#39; />
      <category label=&#39;十二月&#39; />
   </categories>

   <dataset seriesName=&#39;2012&#39;>
      <set value=&#39;45155&#39; />
      <set value=&#39;12452&#39;/>
      <set value=&#39;63455&#39; />
      <set value=&#39;45233&#39; />
      <set value=&#39;95656&#39; />
      <set value=&#39;87545&#39; />
      <set value=&#39;12425&#39; />
      <set value=&#39;94633&#39; />
      <set value=&#39;85452&#39; />
      <set value=&#39;75455&#39; />
      <set value=&#39;32312&#39; />
      <set value=&#39;65625&#39; />
   </dataset>

   <dataset seriesName=&#39;2013&#39;>
      <set value=&#39;65655&#39;/>
      <set value=&#39;74555&#39;/>
      <set value=&#39;61245&#39;/>
      <set value=&#39;12451&#39;/>
      <set value=&#39;95656&#39; />
      <set value=&#39;24655&#39; />
      <set value=&#39;45122&#39; />
      <set value=&#39;32656&#39; />
      <set value=&#39;65656&#39; />
      <set value=&#39;95666&#39; />
      <set value=&#39;65323&#39; />
      <set value=&#39;54656&#39; />
   </dataset>

</chart>

Copy after login

3. The running result is as shown below

(1) During initialization

(2) When clicking on the legend 2012

(3) When clicking on the legend 2013

## (4) When clicking legend 2012 and legend 2013

The above is the content of FusionCharts 3D double bar chart. For more related content, please pay attention to PHP Chinese Net (www.php.cn)!

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress images for free

Clothoff.io

AI clothes remover

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)

3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

R.E.P.O. Best Graphic Settings

3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Assassin's Creed Shadows: Seashell Riddle Solution

2 weeks ago By DDD

R.E.P.O. How to Fix Audio if You Can't Hear Anyone

3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

WWE 2K25: How To Unlock Everything In MyRise

4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Hot Topics

Where is the login entrance for gmail email?

7484

CakePHP Tutorial

1377

What is the format of the account name of steam

win11 activation key permanent

nyt connections hints and answers

Related knowledge

Is the conversion speed fast when converting XML to PDF on mobile phone? Apr 02, 2025 pm 10:09 PM

The speed of mobile XML to PDF depends on the following factors: the complexity of XML structure. Mobile hardware configuration conversion method (library, algorithm) code quality optimization methods (select efficient libraries, optimize algorithms, cache data, and utilize multi-threading). Overall, there is no absolute answer and it needs to be optimized according to the specific situation.

How to convert XML files to PDF on your phone? Apr 02, 2025 pm 10:12 PM

It is impossible to complete XML to PDF conversion directly on your phone with a single application. It is necessary to use cloud services, which can be achieved through two steps: 1. Convert XML to PDF in the cloud, 2. Access or download the converted PDF file on the mobile phone.

How to convert XML to PDF on your phone? Apr 02, 2025 pm 10:18 PM

It is not easy to convert XML to PDF directly on your phone, but it can be achieved with the help of cloud services. It is recommended to use a lightweight mobile app to upload XML files and receive generated PDFs, and convert them with cloud APIs. Cloud APIs use serverless computing services, and choosing the right platform is crucial. Complexity, error handling, security, and optimization strategies need to be considered when handling XML parsing and PDF generation. The entire process requires the front-end app and the back-end API to work together, and it requires some understanding of a variety of technologies.

Is there any mobile app that can convert XML into PDF? Apr 02, 2025 pm 08:54 PM

An application that converts XML directly to PDF cannot be found because they are two fundamentally different formats. XML is used to store data, while PDF is used to display documents. To complete the transformation, you can use programming languages and libraries such as Python and ReportLab to parse XML data and generate PDF documents.

Recommended XML formatting tool Apr 02, 2025 pm 09:03 PM

XML formatting tools can type code according to rules to improve readability and understanding. When selecting a tool, pay attention to customization capabilities, handling of special circumstances, performance and ease of use. Commonly used tool types include online tools, IDE plug-ins, and command-line tools.

How to open xml format Apr 02, 2025 pm 09:00 PM

Use most text editors to open XML files; if you need a more intuitive tree display, you can use an XML editor, such as Oxygen XML Editor or XMLSpy; if you process XML data in a program, you need to use a programming language (such as Python) and XML libraries (such as xml.etree.ElementTree) to parse.

How to open web.xml Apr 03, 2025 am 06:51 AM

To open a web.xml file, you can use the following methods: Use a text editor (such as Notepad or TextEdit) to edit commands using an integrated development environment (such as Eclipse or NetBeans) (Windows: notepad web.xml; Mac/Linux: open -a TextEdit web.xml)

How to convert XML to PDF on your phone with high quality? Apr 02, 2025 pm 09:48 PM

Convert XML to PDF with high quality on your mobile phone requires: parsing XML in the cloud and generating PDFs using a serverless computing platform. Choose efficient XML parser and PDF generation library. Handle errors correctly. Make full use of cloud computing power to avoid heavy tasks on your phone. Adjust complexity according to requirements, including processing complex XML structures, generating multi-page PDFs, and adding images. Print log information to help debug. Optimize performance, select efficient parsers and PDF libraries, and may use asynchronous programming or preprocessing XML data. Ensure good code quality and maintainability.

See all articles