Question

我正在尝试测试在here中找到的amCharts 4 Javascript示例代码，但是在控制台中出现以下错误：

charts.html:9 GET file://www.amcharts.com/lib/4/core.js net::ERR_FILE_NOT_FOUND
charts.html:10 GET file://www.amcharts.com/lib/4/charts.js net::ERR_FILE_NOT_FOUND
charts.html:11 GET file://www.amcharts.com/lib/4/maps.js net::ERR_FILE_NOT_FOUND
charts.html:17 Uncaught ReferenceError: am4core is not defined
at charts.html:17

我已经在Google Chrome浏览器（版本72.0.3626.119）和Firefox中进行了尝试，但两者都产生了相同的结果。页面无法找到CDN并显示图表。

在访问链接时，一切似乎都是正确的，因此这似乎不是问题。我还下载了文件并尝试在本地连接，再次产生相同的结果。

下面的代码段按预期运行，并且显示饼图没有问题，但是在Chrome或Firefox中打开饼图对我来说均不起作用。

任何建议将不胜感激。

代码如下：

<!DOCTYPE html>
<html>
	<head>
		<title>AMCharts Example</title>
			
		<script src="//www.amcharts.com/lib/4/core.js"></script>
		<script src="//www.amcharts.com/lib/4/charts.js"></script>

	</head>
	<body>

		<div id="chartdiv" style="width: 900px; height: 800px;"></div>

		<script>
		// Create chart instance
		var chart = am4core.create("chartdiv", am4charts.PieChart);
		
		// Create pie series
		var series = chart.series.push(new am4charts.PieSeries());
		series.dataFields.value = "litres";
		series.dataFields.category = "country";
		
		// Add data
		chart.data = [{
		  "country": "Lithuania",
		  "litres": 501.9
		}, {
		  "country": "Czech Republic",
		  "litres": 301.9
		}, {
		  "country": "Ireland",
		  "litres": 201.1
		}, {
		  "country": "Germany",
		  "litres": 165.8
		}, {
		  "country": "Australia",
		  "litres": 139.9
		}, {
		  "country": "Austria",
		  "litres": 128.3
		}, {
		  "country": "UK",
		  "litres": 99
		}, {
		  "country": "Belgium",
		  "litres": 60
		}, {
		  "country": "The Netherlands",
		  "litres": 50
		}];
		
		// And, for a good measure, let's add a legend
		chart.legend = new am4charts.Legend();
		</script>
		
	</body>
</html>

按照丹尼尔的建议，将脚本src标记更改为包括https协议后，出现以下错误：

core.js:1 Failed to load resource: net::ERR_FILE_NOT_FOUND
charts.js:1 Failed to load resource: net::ERR_FILE_NOT_FOUND
maps.js:1 Failed to load resource: net::ERR_FILE_NOT_FOUND
charts.html:17 Uncaught ReferenceError: am4core is not defined
at charts.html:17

Answer 1

您在<script>标记中使用了协议相对路径，但是404错误显示了URL上的file://协议，这表明您正在从file://进行测试URL，而不是来自真实Web服务器的URL。

（在实时服务器上测试时，您在问题中张贴的代码可以正常工作）：

// Create chart instance
var chart = am4core.create("chartdiv", am4charts.PieChart);

// Create pie series
var series = chart.series.push(new am4charts.PieSeries());
series.dataFields.value = "litres";
series.dataFields.category = "country";

// Add data
chart.data = [{
  "country": "Lithuania",
  "litres": 501.9
}, {
  "country": "Czech Republic",
  "litres": 301.9
}, {
  "country": "Ireland",
  "litres": 201.1
}, {
  "country": "Germany",
  "litres": 165.8
}, {
  "country": "Australia",
  "litres": 139.9
}, {
  "country": "Austria",
  "litres": 128.3
}, {
  "country": "UK",
  "litres": 99
}, {
  "country": "Belgium",
  "litres": 60
}, {
  "country": "The Netherlands",
  "litres": 50
}];

// And, for a good measure, let's add a legend
chart.legend = new am4charts.Legend();

<script src="//www.amcharts.com/lib/4/core.js"></script>
<script src="//www.amcharts.com/lib/4/charts.js"></script>

<div id="chartdiv" style="width: 900px; height: 800px;">
  </div>

要么在本地主机上测试代码，要么切换那些<script>标签以使用完整的https://（或http://）协议。

<script src="https://www.amcharts.com/lib/4/core.js"></script>
<script src="https://www.amcharts.com/lib/4/charts.js"></script>

amCharts 4 CDN net :: ERR_FILE_NOT_FOUND

1 个答案: