mirror of
https://github.com/bendtherules/line_chart_demo.git
synced 2026-08-18 22:03:16 +00:00
Fix desc and link
This commit is contained in:
+239
-4
@@ -7,14 +7,14 @@
|
||||
FusionCharts.ready(function(){
|
||||
var fusioncharts = new FusionCharts({
|
||||
type: 'column2d',
|
||||
renderAt: 'chart-container',
|
||||
renderAt: 'chart-container1',
|
||||
width: '500',
|
||||
height: '300',
|
||||
dataFormat: 'json',
|
||||
dataSource: {
|
||||
"chart": {
|
||||
"caption": "Revenue by store managers",
|
||||
"subCaption": "Last quarter",
|
||||
"caption": "First image is CORS and server-side export",
|
||||
"subCaption": "Should send to server as svg with image links",
|
||||
"xAxisName": "Managers",
|
||||
"yAxisName": "Revenue (In USD)",
|
||||
"numberPrefix": "$",
|
||||
@@ -80,10 +80,245 @@
|
||||
}
|
||||
);
|
||||
fusioncharts.render();
|
||||
|
||||
var fusioncharts = new FusionCharts({
|
||||
type: 'column2d',
|
||||
renderAt: 'chart-container2',
|
||||
width: '500',
|
||||
height: '300',
|
||||
dataFormat: 'json',
|
||||
dataSource: {
|
||||
"chart": {
|
||||
"caption": "First image is CORS and no server-side",
|
||||
"subCaption": "Export using front-end only with missing image",
|
||||
"xAxisName": "Managers",
|
||||
"yAxisName": "Revenue (In USD)",
|
||||
"numberPrefix": "$",
|
||||
"theme": "fint",
|
||||
"exportEnabled": "1",
|
||||
"exportAtClientSide": "1",
|
||||
"LabelPadding": "50"
|
||||
},
|
||||
"annotations": {
|
||||
"groups": [{
|
||||
"id": "user-images",
|
||||
"items": [{
|
||||
"id": "jennifer-user-icon",
|
||||
"type": "image",
|
||||
"url": "http://static.fusioncharts.com/sampledata/images/round-2.png",
|
||||
"x": "$xaxis.label.0.x - 24",
|
||||
"y": "$xaxis.label.0.y - 48"
|
||||
}, {
|
||||
"id": "tom-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/round-2.png",
|
||||
"x": "$xaxis.label.1.x - 24",
|
||||
"y": "$xaxis.label.1.y - 48"
|
||||
}, {
|
||||
"id": "Milton-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/round-2.png",
|
||||
"x": "$xaxis.label.2.x - 24",
|
||||
"y": "$xaxis.label.2.y - 48"
|
||||
}, {
|
||||
"id": "Brian-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/round-2.png",
|
||||
"x": "$xaxis.label.3.x - 24",
|
||||
"y": "$xaxis.label.3.y - 48"
|
||||
}, {
|
||||
"id": "Lynda-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/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();
|
||||
|
||||
|
||||
var fusioncharts = new FusionCharts({
|
||||
type: 'column2d',
|
||||
renderAt: 'chart-container3',
|
||||
width: '500',
|
||||
height: '300',
|
||||
dataFormat: 'json',
|
||||
dataSource: {
|
||||
"chart": {
|
||||
"caption": "No CORS and no server-side",
|
||||
"subCaption": "Export Image on frontend with all images",
|
||||
"xAxisName": "Managers",
|
||||
"yAxisName": "Revenue (In USD)",
|
||||
"numberPrefix": "$",
|
||||
"theme": "fint",
|
||||
"exportEnabled": "1",
|
||||
"exportAtClientSide": "1",
|
||||
"LabelPadding": "50"
|
||||
},
|
||||
"annotations": {
|
||||
"groups": [{
|
||||
"id": "user-images",
|
||||
"items": [{
|
||||
"id": "jennifer-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/round-2.png",
|
||||
"x": "$xaxis.label.0.x - 24",
|
||||
"y": "$xaxis.label.0.y - 48"
|
||||
}, {
|
||||
"id": "tom-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/round-2.png",
|
||||
"x": "$xaxis.label.1.x - 24",
|
||||
"y": "$xaxis.label.1.y - 48"
|
||||
}, {
|
||||
"id": "Milton-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/round-2.png",
|
||||
"x": "$xaxis.label.2.x - 24",
|
||||
"y": "$xaxis.label.2.y - 48"
|
||||
}, {
|
||||
"id": "Brian-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/round-2.png",
|
||||
"x": "$xaxis.label.3.x - 24",
|
||||
"y": "$xaxis.label.3.y - 48"
|
||||
}, {
|
||||
"id": "Lynda-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/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();
|
||||
|
||||
|
||||
var fusioncharts = new FusionCharts({
|
||||
type: 'column2d',
|
||||
renderAt: 'chart-container4',
|
||||
width: '500',
|
||||
height: '300',
|
||||
dataFormat: 'json',
|
||||
dataSource: {
|
||||
"chart": {
|
||||
"caption": "No CORS and uses server-side",
|
||||
"subCaption": "Send to server as SVG for export",
|
||||
"xAxisName": "Managers",
|
||||
"yAxisName": "Revenue (In USD)",
|
||||
"numberPrefix": "$",
|
||||
"theme": "fint",
|
||||
"exportEnabled": "1",
|
||||
"exportAtClient": "0",
|
||||
"exportHandler": "x.com",
|
||||
"LabelPadding": "50"
|
||||
},
|
||||
"annotations": {
|
||||
"groups": [{
|
||||
"id": "user-images",
|
||||
"items": [{
|
||||
"id": "jennifer-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/round-2.png",
|
||||
"x": "$xaxis.label.0.x - 24",
|
||||
"y": "$xaxis.label.0.y - 48"
|
||||
}, {
|
||||
"id": "tom-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/round-2.png",
|
||||
"x": "$xaxis.label.1.x - 24",
|
||||
"y": "$xaxis.label.1.y - 48"
|
||||
}, {
|
||||
"id": "Milton-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/round-2.png",
|
||||
"x": "$xaxis.label.2.x - 24",
|
||||
"y": "$xaxis.label.2.y - 48"
|
||||
}, {
|
||||
"id": "Brian-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/round-2.png",
|
||||
"x": "$xaxis.label.3.x - 24",
|
||||
"y": "$xaxis.label.3.y - 48"
|
||||
}, {
|
||||
"id": "Lynda-user-icon",
|
||||
"type": "image",
|
||||
"url": "images/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 id="chart-container">FusionCharts XT will load here!</div>
|
||||
<div id="chart-container1">FusionCharts XT will load here!</div>
|
||||
<div id="chart-container2">FusionCharts XT will load here!</div>
|
||||
<div id="chart-container3">FusionCharts XT will load here!</div>
|
||||
<div id="chart-container4">FusionCharts XT will load here!</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user