Highchart not executed
Highchart not executed
我用highchart来画饼状图。我得到了ajax响应,但我的聊天没有执行。我曾把警报也不过警报("highchart called");直到我的所有警报被执行。我认为期权系列[0]。data = responsePIE;是错的,但不确定。我的main12.js代码如下:
$(document).ready(function()
{
$(function ()
{
$('#container').highcharts(
{
chart:
{
plotBackgroundColor: null,
plotBorderWidth: 1,//null,
plotShadow: false
},
title:
{
text: 'Browser market shares at a specific website, 2014'
},
tooltip:
{
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
},
plotOptions:
{
pie:
{
allowPointSelect: true,
cursor: 'pointer',
dataLabels:
{
enabled: true,
format: '<b>{point.name}</b>: {point.percentage:.1f} %',
style:
{
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
}
}
}
},
series: [{
type: 'pie',
name: 'Browser share',
data: []
}]
});
});
$.getJSON("GetReportdata", function(json) {
var call11 = JSON.stringify(json);
alert(call11);
var responsePIE = jQuery.parseJSON(call11);
alert(responsePIE[1].title);
options.series[0].data = responsePIE;
alert("highchart called");
var chart = new Highcharts.Chart(options);
});
});
我的jsp代码如下:
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<link href="../css/demo.css" rel="stylesheet">
<script src="../js/jquery.js"></script>
<script src="../external js/jquery-1.9.1.js"></script>
<script src="../external js/jquery-ui.js"></script>
</head>
<body>
<script src="../js/highcharts.js"></script>
<script src="../js/exporting.js"></script>
<script src="../js/main12.js"></script>
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
<div id="container2" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
</body>
</html>
谢谢
看起来这行是错的:
options.series[0].data = responsePIE;
,因为你没有定义选项。
将选项变量设置为完整的图表定义并在getJson回调中创建图表,或者先创建图表,然后使用series setData()方法(http://api.highcharts.com/highcharts#Series.setData)在getJson回调中设置现有图表上的系列数据。
你的脚本应该看起来像:
<script type="text/javascript">
$(function () {
var chart2;
$.getJSON("pie.json", function(json2) {
chart2 = new Highcharts.Chart({
chart: {
type:'pie',
renderTo: 'container2',
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Interactive Pie'
},
tooltip: {
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ this.y +' %';
}
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: false
},
showInLegend: true
}
},
series: [{
type: 'pie',
name: 'Browser share',
data: json2
}]
});
});
});
</script>
和json数据格式:[["chrome",15],["firefox",20],["Android",26],["safari",6]]
查看饼状图
相关文章:
- jQuery is not loaded
- AngularJS JSON not arriving php
- $rootScope not working
- reactRedux is not defined
- jQuery document.ready not working
- Javascript/Jquery Blob not showing Chrome PDF
- ReferenceError: not defined
- ReferenceError: cordova is not defined @ng-cordova.min.js:7
- Javascript getElementsByTagName not working?
- jQuery's trim()的前缀为not运算符
- Javascript - element.childNodes does not see an append.newch
- SemanticUI模态not onDeny/onApprove事件未激发
- WebkitTransform not fluent
- JQuery.val( ) not working
- Tomcat websocket is not working
- Javascript not executed
- PHP & HTML Form with javascript onsubmit not executed
- Highchart not executed
- Javascript not executed?
- ASP.NET javascript not executed