Home Backend Development XML/RSS Tutorial FusionCharts 3D Dual Bar Chart

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>

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>

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 (m.sbmmt.com)!

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

Undress AI Tool

Undress AI Tool

Undress images for free

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Hot Topics

PHP Tutorial
1510
276
XML Schema : Examples in PHP XML Schema : Examples in PHP Jul 23, 2025 am 12:27 AM

XMLSchemavalidationinPHPisachievedusingDOMDocumentandDOMXPathclasseswiththelibxmlextension.1)LoadtheXMLfilewithDOMDocument.2)UseschemaValidatetovalidateagainstanXSDschema,throwinganexceptionifvalidationfails.3)Forlargefiles,useXMLReaderforstreamingva

How to Integrate an External RSS Feed into a Shopify Store How to Integrate an External RSS Feed into a Shopify Store Jul 24, 2025 am 02:13 AM

TointegrateanexternalRSSfeedintoShopify,firstverifythefeed’svalidityandformatting.2.UsecustomJavaScriptwithaproxyAPIlikeRSS2JSONtofetchanddisplaythefeedinaLiquidtemplate,asShopifylacksnativesupport.3.Alternatively,useano-codeShopifyappsuchasBlog&

Benefits of XML for Developers: Simplicity, Flexibility, and Portability Benefits of XML for Developers: Simplicity, Flexibility, and Portability Jul 20, 2025 am 03:59 AM

XMLbenefitsdeveloperswithitssimplicity,flexibility,andportability.1)Itshuman-readableformataidsineasydebugging.2)Customizabletagsallowforadaptabledatastructures.3)Platformindependenceensuresseamlessdataexchangeacrosssystems.

XML : What if I don't validate my Well-Formed XML? XML : What if I don't validate my Well-Formed XML? Jul 21, 2025 am 02:28 AM

Notvalidatingwell-formedXMLcanleadtoseriousissues.1)Dataintegrityerrorsoccurwithoutvalidation.2)InteroperabilityissuesariseassystemsmayinterpretXMLdifferently.3)SecurityrisksincreaseduetopotentialexploitationbymaliciousXML.Alwaysuseschemasandautomate

XML Writing Rules: Avoid Common Errors XML Writing Rules: Avoid Common Errors Jul 21, 2025 am 01:50 AM

CommonXMLerrorsincludemismatchedtags,impropernesting,unquotedattributevalues,casesensitivityissues,invalidcharacters,andmisuseddeclarations.Toavoidthese:1)UseXMLeditorswithsyntaxhighlightingandauto-completiontopreventmismatchedtags.2)Mentallystructur

Converting XML to a Python Dictionary Converting XML to a Python Dictionary Jul 25, 2025 am 01:24 AM

Using xmltodict is the recommended method for converting XML to Python dictionary. 1. Install the xmltodict library: pipinstallxmltodict; 2. Use xmltodict.parse() to parse XML strings into dictionaries, and automatically handle nested elements, duplicate tags and attributes; 3. You can customize attribute prefix through the attr_prefix parameter; if you cannot install a third-party library, you can use the built-in xml.etree.ElementTree to convert Element objects into dictionaries through recursive functions, but you need to manually process lists, attributes and text nodes; pay attention to performance issues when dealing with empty elements, type conversion, namespace and large files.

A look at the SimpleXML library in PHP for easy XML manipulation A look at the SimpleXML library in PHP for easy XML manipulation Jul 27, 2025 am 01:06 AM

SimpleXMListherighttoolforstraightforwardXMLmanipulationinPHP,asitconvertsXMLintoeasy-to-navigatePHPobjects.1.ItallowsloadingXMLfromastringorfileusingsimplexml_load_string()orsimplexml_load_file().2.Elementsareaccessedlikeobjectproperties,andattribut

Fetching and Parsing an RSS Feed in a Swift iOS Application Fetching and Parsing an RSS Feed in a Swift iOS Application Jul 23, 2025 am 02:25 AM

Use URLSession to obtain RSSXML data asynchronously; 2. Parses XML through XMLParserDelegate and extracts title, link, description and other fields; 3. Update the UI to display the parsed RSSItem array in the main thread to complete the complete process from network request to data display.

See all articles