我是 javascript 新手,总体来说不太擅长编码。我一直在尝试使用从 Fusion Charts 获得的 JavaScript 代码来创建圆环图,但它不起作用。我尝试过在 html 中使用带有 src 的单独 .js 文件,并将 javascript 代码放在 html 内的脚本标记中。 javascript 也不会显示在网页上。这可能是非常简单的事情。
<div id="chart-container">FusionCharts will render here</div>
(和我的 JavaScript)
FusionCharts.ready(function () {
var revenueChart = new FusionCharts({
type: 'doughnut2d',
renderAt: 'chart-container',
width: '450',
height: '450',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "Homicides by Weapon",
"subCaption": "USA 2013",
"numberPrefix": "",
"paletteColors": "#0075c2,#1aaf5d,#f2c500,#f45b00,#8e0000",
"bgColor": "#ffffff",
"showBorder": "0",
"use3DLighting": "0",
"showShadow": "0",
"enableSmartLabels": "0",
"startingAngle": "310",
"showLabels": "0",
"showPercentValues": "1",
"showLegend": "1",
"legendShadow": "0",
"legendBorderAlpha": "0",
"defaultCenterLabel": "Total homicides: 11583",
"centerLabel": "Homicides from $label: $value",
"centerLabelBold": "1",
"showTooltip": "0",
"decimals": "0",
"captionFontSize": "14",
"subcaptionFontSize": "14",
"subcaptionFontBold": "0"
},
"data": [
{
"label": "Firearms",
"value": "8454"
},
{
"label": "Knives or cutting instruments",
"value": "1490"
},
{
"label": "Personal Weapons (hands, fists, etc.)",
"value": "687"
},
{
"label": "Other",
"value": "952"
}
]
}
}).render();
});
最佳答案
要渲染 FusionCharts,您需要在 head 标签中添加 FC 库。 请尝试使用cdn链接FC 3.10.1 Library 或者您可以使用下面的代码来渲染 fusionchart
<html>
<head>
<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">
FusionCharts.ready(function () {
var revenueChart = new FusionCharts({
type: 'doughnut2d',
renderAt: 'chart-container',
width: '450',
height: '450',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "Homicides by Weapon",
"subCaption": "USA 2013",
"numberPrefix": "",
"paletteColors": "#0075c2,#1aaf5d,#f2c500,#f45b00,#8e0000",
"bgColor": "#ffffff",
"showBorder": "0",
"use3DLighting": "0",
"showShadow": "0",
"enableSmartLabels": "0",
"startingAngle": "310",
"showLabels": "0",
"showPercentValues": "1",
"showLegend": "1",
"legendShadow": "0",
"legendBorderAlpha": "0",
"defaultCenterLabel": "Total homicides: 11583",
"centerLabel": "Homicides from $label: $value",
"centerLabelBold": "1",
"showTooltip": "0",
"decimals": "0",
"captionFontSize": "14",
"subcaptionFontSize": "14",
"subcaptionFontBold": "0"
},
"data": [
{
"label": "Firearms",
"value": "8454"
},
{
"label": "Knives or cutting instruments",
"value": "1490"
},
{
"label": "Personal Weapons (hands, fists, etc.)",
"value": "687"
},
{
"label": "Other",
"value": "952"
}
]
}
}).render();
});
</script>
</head>
<body>
<div id="chart-container">FusionCharts will render here</div>
</body>
</html>
关于javascript - Fusion Tables javascript 图表不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34684780/