mirror of
https://github.com/bendtherules/line_chart_demo.git
synced 2026-08-18 13:52:30 +00:00
Fix desc and link
This commit is contained in:
+239
-4
@@ -7,14 +7,14 @@
|
|||||||
FusionCharts.ready(function(){
|
FusionCharts.ready(function(){
|
||||||
var fusioncharts = new FusionCharts({
|
var fusioncharts = new FusionCharts({
|
||||||
type: 'column2d',
|
type: 'column2d',
|
||||||
renderAt: 'chart-container',
|
renderAt: 'chart-container1',
|
||||||
width: '500',
|
width: '500',
|
||||||
height: '300',
|
height: '300',
|
||||||
dataFormat: 'json',
|
dataFormat: 'json',
|
||||||
dataSource: {
|
dataSource: {
|
||||||
"chart": {
|
"chart": {
|
||||||
"caption": "Revenue by store managers",
|
"caption": "First image is CORS and server-side export",
|
||||||
"subCaption": "Last quarter",
|
"subCaption": "Should send to server as svg with image links",
|
||||||
"xAxisName": "Managers",
|
"xAxisName": "Managers",
|
||||||
"yAxisName": "Revenue (In USD)",
|
"yAxisName": "Revenue (In USD)",
|
||||||
"numberPrefix": "$",
|
"numberPrefix": "$",
|
||||||
@@ -80,10 +80,245 @@
|
|||||||
}
|
}
|
||||||
);
|
);
|
||||||
fusioncharts.render();
|
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>
|
</script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<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>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
Reference in New Issue
Block a user