我使用Highcharts库开发图表并且在第一次工作正常但是当我回来运行应用程序时我发现所有图表都是黑色图像我不知道为什么？
我的jsp：
<html>
<head>
<script src="<c:url value='/assets/js/jquery.js' />"></script>
<script src="<c:url value='/assets/js/highstock.js' />"></script>
<script src="<c:url value='/assets/js/highcharts.js' />"></script>
<script src="<c:url value='/assets/js/highmaps.js' />"></script>
<script src="<c:url value='/assets/js/exporting.js' />"></script>
<script src="http://highcharts.github.io/export-csv/export-csv.js">
</head>
<body>
<div id="impressionChart" style="height: 400px"></div>
<script type="text/javascript">
var campaignId = $('#campaignId').val();
var processed_json = [];
var parsedJson;
var myArray = [];
var url = "/ADVoice/advertiser/campaign/performance/campaignImpression/"
+ campaignId;
$
.ajax({
url : url,
datatype : "json",
type : "GET",
async : false,
success : function(data) {
// alert(data);
parsedJson = JSON.stringify(data);
alert(parsedJson);
var jsonArray = JSON.parse(parsedJson);
// alert(jsonArray['campaign_data'].length);
for (i = 0; i < jsonArray['campaign_data'].length; i++) {
myArray[i] = [];
myArray[i][0] = Date
.parse(jsonArray['campaign_data'][i].key);
myArray[i][1] = parseInt(jsonArray['campaign_data'][i].value);
}
// alert(myArray);
},
error : function() {
alert("error");
}
});
// draw chart
Highcharts.setOptions({
global : {
useUTC : false
}
});
$('#impressionChart').highcharts({
chart : {
type : "column"
},
title : {
text : "Campaign Impression"
},
xAxis : {
type : 'datetime',
labels : {
formatter : function() {
return Highcharts.dateFormat('%a %d %b', this.value);
}
}
},
yAxis : {
title : {
text : "Number of impressions"
}
},
series : [ {
name : "No.Impressions:",
data : myArray,
pointStart : Date.parse(myArray[0][0])
// pointInterval: 24 * 3600 * 1000 // one day
} ],
exporting : {
csv : {
dateFormat : '%Y-%m-%d'
}
}
});
</script>
</body>
</html>
我在使用Highcharts-6.1.0时遇到了这个问题。
解决方案： -
src="Scripts/Highcharts-6.1.0/code/js/highcharts-3d.js"
进口于
src="Scripts/Highcharts-6.1.0/code/highcharts-3d.js"**
src="Scripts/Highcharts-6.1.0/code/modules/highcharts-3d.js"
在使用Highcharts的“style by css”版本时，我遇到了类似的问题。当我尝试将图表下载为png时，我得到了黑色图像。
使用http://code.highcharts.com/js/modules/exporting.js而不是http://code.highcharts.com/modules/exporting.js解决了我的问题。 code.highcharts.com没有按照css标题的样式列出这个文件，但它说所有样式版本相关的文件都在“/ js /”文件夹下。
编辑：在7.x版本的highcharts之后，样式版本与非样式版本合并。以上链接是最新版本，因此可能无法解决7.x之前的问题。升级到最新版并使用“chart.styledMode = true”为我解决了整个问题。
正如你将在这个CodePen中看到的那样，我用你得到的结果“替换”了你的ajax函数。
我认为您的Ajax请求是正常的，因为您获得此结果，我根本无法在CodePen中执行此操作。我和你使用完全一样的for loop。
关于控制台中的错误，the link you provided非常明确。它说你称HightCharts功能包含在highstock库中。
<script src="<c:url value='/assets/js/jquery.js' />"></script>
<script src="<c:url value='/assets/js/highstock.js' />"></script>
<!-- script src="<c:url value='/assets/js/highcharts.js' />"></script -->
<script src="<c:url value='/assets/js/highmaps.js' />"></script>
<script src="<c:url value='/assets/js/exporting.js' />"></script>
<script src="http://highcharts.github.io/export-csv/export-csv.js">
只需注释掉上面的highcharts.js。
如果有人仍然遇到这个问题，我可以通过使用一个RGB值指定图表的所有颜色来解决问题。
例如在ASP.NET中，此代码：
chart.SetSeries(new[]
{
new Series {
Name = "Average",
Data = GetAverageData(),
Color = Color.Crimson
},
new Series {
Name = "Order",
Data = GetOrderData(),
Color = Color.RoyalBlue
}
});
被转换为：
chart.SetSeries(new[]
{
new Series {
Name = "Average",
Data = GetAverageData(),
Color = Color.FromArgb(255, 220, 20, 60)
},
new Series {
Name = "Order",
Data = GetOrderData(),
Color = Color.FromArgb(255, 65, 105, 225)
}
});