Sign in to follow this  
eagles9999

Am I missing something?

Recommended Posts

Hello,

 

I have been using Fusion Charts for a long time an have no problem with them but I am now

looking at Fusion Widgets and want to try out a horizontal linear gauge.

 

For some reason I cannot get it to display and have searched for a reason but cannot find an answer.

 

Not sure if I have a typo or some fundamental error.

 

Any help here would be appreciated.

 

Here is my code.....

 

<html>
<head>
<title>My first gauge using FusionWidgets XT</title>
<script type="text/javascript" src="fusioncharts/fusioncharts.js"></script>
<script type="text/javascript" src="fusioncharts/fusioncharts.widgets.js"></script>
<script type="text/javascript" src="fusioncharts/themes/fusioncharts.theme.fint.js"></script>
<script type="text/javascript">
FusionCharts.ready(function () {
    var csatGauge = new FusionCharts({
       "type": "hlineargauge",
        "renderAt": "chart-container",
        "width": "400",
        "height": "250",
        "dataFormat": "XML",
        "dataSource":
                                "<chart caption="Server CPU Utilization" subcaption="food.hsm.com" captionfontcolor="#000000" subcaptionfontbold="0" bgcolor="#ffffff" showborder="0" lowerlimit="0" upperlimit="100"                                         numbersuffix="%" valueabovepointer="0" showshadow="0" gaugefillmix="{light}" valuebgcolor="#ffffff" valuebgalpha="60" valuefontcolor="#000000" pointerbgcolor="#ffffff"                                                               pointerbgalpha="50" basefontcolor="#ffffff">
                                    <colorrange>
                                       <color minvalue="0" maxvalue="35" label="Low" code="#1aaf5d" />
                                       <color minvalue="35" maxvalue="70" label="Moderate" code="#f2c500" />
                                       <color minvalue="70" maxvalue="100" label="High" code="#c02d00" />
                                    </colorrange>
                                    <pointers>
                                       <pointer value="72.5" />
                                    </pointers>
                                  </chart>"
      });
 
    csatGauge.render();
});
</script>
</head>

 

Share this post


Link to post
Share on other sites

Hi,

 

Could you please try the following chart data in the dataSource element.

<chart caption='Server CPU Utilization' subcaption='food.hsm.com' captionfontcolor='#000000' subcaptionfontbold='0' bgcolor='#ffffff' showborder='0' lowerlimit='0' upperlimit='100' numbersuffix='%' valueabovepointer='0' showshadow='0' gaugefillmix='{light}' valuebgcolor='#ffffff' valuebgalpha='60' valuefontcolor='#000000' pointerbgcolor='#ffffff' pointerbgalpha='50' basefontcolor='#ffffff' ><colorrange><color minvalue='0' maxvalue='35' label='Low' code='#1aaf5d' /><color minvalue='35' maxvalue='70' label='Moderate' code='#f2c500' /><color minvalue='70' maxvalue='100' label='High' code='#c02d00' /></colorrange><pointers><pointer value='72.5' /></pointers></chart>

Please use single quotes for data values instead of double quotes.

 

Thanks.

 

 

 

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