Test fc 1

2026-08-18 13:52:30 +00:00 · 2017-04-19 13:28:31 +05:30
parent 73d147f4cb
commit d9f6f6f07f
1 changed files with 83 additions and 14 deletions
@@ -1,18 +1,87 @@
-<!DOCTYPE html>
-<html lang="en">
+<html>
 <head>
-    <meta charset="UTF-8">
-    <title>Line Chart</title>
-    <link rel="stylesheet" href="index.css">
-    <script type="text/javascript" src="d3.v4.min.js"></script>
-    <script type="text/javascript" src="d3-selection-multi.v0.4.min.js"></script>
-    <script type="text/javascript" src="d3-tip.js"></script>
-    <script type="text/javascript" src="jquery.min.js"></script>
+<title>My first chart using FusionCharts Suite XT</title>
+<script type="text/javascript" src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
+<script type="text/javascript" src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js?cacheBust=56"></script>
+<script type="text/javascript">
+  FusionCharts.ready(function(){
+    var fusioncharts = new FusionCharts({
+    type: 'column2d',
+    renderAt: 'chart-container',
+    width: '500',
+    height: '300',
+    dataFormat: 'json',
+    dataSource: {
+        "chart": {
+            "caption": "Revenue by store managers",
+            "subCaption": "Last quarter",
+            "xAxisName": "Managers",
+            "yAxisName": "Revenue (In USD)",
+            "numberPrefix": "$",
+            "theme": "fint",
+            "exportEnabled": "1",
+            "LabelPadding": "50"
+        },
+        "annotations": {
+            "groups": [{
+                "id": "user-images",
+                "items": [{
+                    "id": "jennifer-user-icon",
+                    "type": "image",
+                    "url": "round-2.png",
+                    "x": "$xaxis.label.0.x - 24",
+                    "y": "$xaxis.label.0.y - 48"
+                }, {
+                    "id": "tom-user-icon",
+                    "type": "image",
+                    "url": "round-2.png",
+                    "x": "$xaxis.label.1.x - 24",
+                    "y": "$xaxis.label.1.y - 48"
+                }, {
+                    "id": "Milton-user-icon",
+                    "type": "image",
+                    "url": "round-2.png",
+                    "x": "$xaxis.label.2.x - 24",
+                    "y": "$xaxis.label.2.y - 48"
+                }, {
+                    "id": "Brian-user-icon",
+                    "type": "image",
+                    "url": "round-2.png",
+                    "x": "$xaxis.label.3.x - 24",
+                    "y": "$xaxis.label.3.y - 48"
+                }, {
+                    "id": "Lynda-user-icon",
+                    "type": "image",
+                    "url": "round-2.png",
+                    "x": "$xaxis.label.4.x - 24",
+                    "y": "$xaxis.label.4.y - 48"
+                }]
+            }]
+        },
+        "data": [{
+            "label": "Jennifer",
+            "value": "92000"
+        }, {
+            "label": "Tom",
+            "value": "87000"
+        }, {
+            "label": "Milton",
+            "value": "83000"
+        }, {
+            "label": "Brian",
+            "value": "66000"
+        }, {
+            "label": "Lynda",
+            "value": "58000"
+        }]
+    }
+}
+);
+    fusioncharts.render();
+});
+</script>
 </head>
 <body>
-    <div class="chart-container">
-        <line-chart data-points="[[3,4],[6,5],[20,70],[40,30]]"></line-chart>
-    </div>
-    <script type="text/javascript" src="index.js"></script>
+  <div id="chart-container">FusionCharts XT will load here!</div>
 </body>
 </html>