0
我的Highchart在Chrome中顯示正常，但是當我嘗試在Internet Explorer中打開它時，只顯示標題和CSS邊框。我的主要問題是，當我試圖在Java應用程序的jEditorPane中顯示它時，它不會顯示出來;它只顯示邊框。我可以在jEditorPane中顯示簡單的HTML頁面，但我猜這與javascript/jquery有關？高級圖表不顯示在jEditorPane中
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Chart Title</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<link href='http://fonts.googleapis.com/css?family=Oswald:400' rel='stylesheet' type='text/css'>
<script type="text/javascript">
$(function() {
Highcharts.setOptions({
colors: ['#1a1334','#26294a','#01545a','#017351','#03c383','#aad962','#fbbf45','#ef6a32','#ed0345','#a12a5e','#710162','#110141']
});
var chart;
$(document).ready(function() {
$('#container').highcharts({
chart: {
type: 'pie',
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
backgroundColor: '#f5f5f5'
},
title: {
text: 'Chart Title',
style: {
fontSize: '35px',
fontWeight: 'bold',
fontFamily: 'Oswald'
}
},
tooltip: {
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
format: '<b>{point.y}</b>: {point.percentage:.1f} %',
style: {
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black',
fontSize: '15px'
}
},
showInLegend: true
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
y: 75,
backgroundColor: '#e4e4e4',
borderRadius: '5px',
itemStyle: {
fontSize: '15px',
fontWeight: 'light'
}
},
credits: {
enabled: false
},
series: [{
name: 'Chart Title',
innerSize: '40%',
data: [
['Work',11],
['Eat',2],
['Commute',2],
['Watch TV',2],
['Sleep',7],
['Other', 30],
['New', 45],
['Extra', 56], ]
}]
});
});
});
</script>
</head>
<body>
<div id="container" style="width: 945px; height: 525px; border-color: #333; border-style: solid; border-width: 10px 5px 5px 10px;"></div>
</body>
</html>
的JEditorPane代碼：
jEditorPane1.setEditable(false);
try {
jEditorPane1.setPage(getClass().getResource("html/pie.html"));
} catch (IOException e) {
System.out.println(e);
}
大多數不顯示Highcharts的解決方案所涉及的腳本的順序，但我敢肯定，這不是我的問題。
任何想法？
你收到任何問題，因爲它肯定是隻與JEditorPane中有關。你有沒有嘗試使用java的highcharts包裝，然後在jEditor？ （http://www.highcharts.com/component/content/article/14-articles/2-third-party-implementation/） –
我意識到這是因爲jEditorPane不完全支持CSS和其他一些高層次功能使用的功能。我想我需要使用一個單獨的java庫爲了這個工作 –
是的，你需要庫，它將完全支持JS/CSS和SVG，使Highcharts正常工作。 –