<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@page import="fusioncharts.FusionCharts" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link href="../Styles/ChartSampleStyleSheet.css" rel="stylesheet" />
<script type="text/javascript" src="//cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js"></script>
<script type="text/javascript" src="//cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js"></script>
<title>FusionCharts | Use of fusioncharts number module API</title>
</head>
<body>
<script>
function onRenderComplete(eventObj) {
var formattedNumber = eventObj.sender.formatNumber(1234.5);
document.getElementById("rendered").innerHTML = "format 1234.5 : " + formattedNumber;
}
</script>
<h3>Use of fusioncharts number module API</h3>
<div id ="chart"></div>
<div>
<p id ="rendered"></p>
</div>
<div><span><a href="../Index.jsp">Go Back</a></span></div>
<%
String jsonData;
jsonData = "{ 'chart': { 'caption': 'Countries With Most Oil Reserves [2017-18]', 'subCaption': 'In MMbbl = One Million barrels', 'xAxisName': 'Country', 'yAxisName': 'Reserves (MMbbl)', 'numberPrefix': '$', 'decimals': '2', 'forceDecimals': '1', 'theme': 'fusion', }, 'data': [{ 'label': 'Venezuela', 'value': '290' }, { 'label': 'Saudi', 'value': '260' }, { 'label': 'Canada', 'value': '180' }, { 'label': 'Iran', 'value': '140' }, { 'label': 'Russia', 'value': '115' }, { 'label': 'UAE', 'value': '100' }, { 'label': 'US', 'value': '30' }, { 'label': 'China', 'value': '30' }] }";
FusionCharts column_chart = new FusionCharts(
"column2d",
"column_chart",
"700",
"400",
"chart",
"json",
jsonData
);
column_chart.addEvent("renderComplete", "onRenderComplete");
%>
<%=column_chart.render()%>
</body>
</html>