在 Fusioncharts 和纯 JAVASCRIPT 示例中显示 JSON、XML、CSV 数据
Posted
技术标签:
【中文标题】在 Fusioncharts 和纯 JAVASCRIPT 示例中显示 JSON、XML、CSV 数据【英文标题】：Display JSON, XML, CSV data in Fusioncharts and pure JAVASCRIPT example 【发布时间】：2021-12-09 17:55:14 【问题描述】：有一个从 JSON 或 XML 绘制数据图表的供应商示例： fusion charts
我是一个完全的初学者，不能让它正常工作，所以有两个问题：
-
能否请您向我发布一个完整的 html 页面源代码，其中嵌入了正确显示 JSON 和 XML 数据示例的 JScript，而示例页面上缺少它？
有人可以更改上述/完整的 HTML 网页以显示来自类似文件的 CSV 数据吗？
干杯。
顺便说一句 - 数据：
--- CSV ---
Polska, Saudi, Kanada, Iran, Russia, UAE, US, China
290, 260, 180, 140, 115, 100, 30, 30
--- 猫远程.json ---
// Chart Configuration
"chart":
"caption": "Wykres danych z pliku JSON",
"subCaption": "In MMbbl = One Million barrels",
"xAxisName": "Country",
"yAxisName": "Reserves (MMbbl)",
"numberSuffix": "K",
"theme": "fusion",
,
// Chart Data
"data": [
"label": "Polska",
"value": "290"
,
"label": "Saudi",
"value": "260"
,
"label": "Kanada",
"value": "180"
,
"label": "Iran",
"value": "140"
,
"label": "Russia",
"value": "115"
,
"label": "UAE",
"value": "100"
,
"label": "US",
"value": "30"
,
"label": "China",
"value": "30"
]
【问题讨论】：
【参考方案1】：好的，我通过这个解决方法得到了工作示例，但这不是教程的供应商/作者提出的方法，所以尽管有以下问题仍然存在，如何运行确切的教程方法以及如何绘制它来自 CSV
工作理念：
使用 JSON
"chart":
"caption": "Wykres danych z pliku JSON",
"subCaption": "Jakiś bardzo szczegółowy opis tych danych...",
"xAxisName": "Kraj",
"yAxisName": "Mierzona wartość z pliku JSON",
"numberSuffix": "K",
"theme": "fusion"
,
"data": [
"label": "Polska",
"value": "290"
,
"label": "Saudi",
"value": "260"
,
"label": "Kanada",
"value": "180"
,
"label": "Iran",
"value": "140"
,
"label": "Russia",
"value": "115"
,
"label": "UAE",
"value": "100"
,
"label": "US",
"value": "130"
,
"label": "China",
"value": "80"
]
和 HTML
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Przykład wykresu dla mnie</title>
<!-- Include fusioncharts core library -->
<script type="text/javascript" src="https://cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js"></script>
<!-- Include fusion theme -->
<script type="text/javascript" src="https://cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js"></script>
<script type="text/javascript">
// TO JEST PIERWSZY WYKRES i ŁADOWANIE DANYCH z INNEGO pliku JSON:
const chartConfig =
type: 'column3d',
renderAt: 'chart-container',
width: '80%',
height: '450',
dataFormat: 'jsonurl',
dataSource: 'wykresy4remote.json'
;
FusionCharts.ready(function()
var fusioncharts = new FusionCharts(chartConfig);
fusioncharts.render();
);
</script>
</head>
<body>
<center>
<div id="chart-container">FusionCharts XT will load here!</div>
</center>
</body>
</html>
请告知，如何更好地使用 CSV。 谢谢。
【讨论】：
以上是关于在 Fusioncharts 和纯 JAVASCRIPT 示例中显示 JSON、XML、CSV 数据的主要内容，如果未能解决你的问题，请参考以下文章