具有框架集的Highcharts饼图问题
我用的是海图饼图。我在一页中显示4个饼图，其中包含不同系列的数据。它工作得很好。但是如果我使用frameset并调用其中的页面，那么这些饼图就不会显示，但是如果我将页面向前移动，然后向后移动，那么这些图表就会显示。请帮忙解决这个问题具有框架集的Highcharts饼图问题,charts,highcharts,pie-chart,Charts,Highcharts,Pie Chart,我用的是海图饼图。我在一页中显示4个饼图，其中包含不同系列的数据。它工作得很好。但是如果我使用frameset并调用其中的页面，那么这些饼图就不会显示，但是如果我将页面向前移动，然后向后移动，那么这些图表就会显示。请帮忙解决这个问题 <?php include('../control/config.php'); if($_REQUEST['basic']!=null) { if($_REQUEST['basic']=='internal') { $basep
<?php
include('../control/config.php');
if($_REQUEST['basic']!=null)
{
if($_REQUEST['basic']=='internal')
{
$basepage='internal.php';
}
if($_REQUEST['basic']=='external')
{
$basepage='index.php';
}
}
$projectdir= '../data/project';
// Open a known directory, and proceed to read its filename
if (is_dir($projectdir))
{
if ($dh = opendir($projectdir))
{
while (($file = readdir($dh)) !== false)
{
if($file!="." and $file!=".." and $file!=".svn")
{
$project_files[]=$file;
}
}
closedir($dh);
}
}
if($_REQUEST['pie']!=null){
if($_REQUEST['pie']==0){
$pie1=0;
$pie2=1;
$pie3=2;
$pie4=3;
}
if($_REQUEST['pie']==1){
$pie1=4;
$pie2=5;
$pie3=6;
$pie4=7;
}
if($_REQUEST['pie']==2){
$pie1=8;
$pie2=9;
$pie3=10;
$pie4=11;
}
if($_REQUEST['pie']==3){
$pie1=12;
$pie2=13;
$pie3=14;
$pie4=15;
}
}
else{
$pie1=0;
$pie2=1;
$pie3=2;
$pie4=3;
}
$projectname1=explode('.',$project_files[$pie1]);
$projectname2=explode('.',$project_files[$pie2]);
$projectname3=explode('.',$project_files[$pie3]);
$projectname4=explode('.',$project_files[$pie4]);
session_start();
$_SESSION['piefilename1'] = '../data/project/'.$project_files[$pie1];
session_start();
$_SESSION['piefilename2'] = '../data/project/'.$project_files[$pie2];
session_start();
$_SESSION['piefilename3'] = '../data/project/'.$project_files[$pie3];
session_start();
$_SESSION['piefilename4'] = '../data/project/'.$project_files[$pie4];
?>
<head>
<title>AFLS ISSUE SUMMARY</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<LINK REL="StyleSheet" HREF="../style/default.css" TYPE="text/css" MEDIA="screen">
<script>
function go_to_url()
{
document.location.href='<?php echo $base_path.$basepage;?>?pgco='+<?php echo $_REQUEST['pgco'];?>+'&pie='+<?php echo $_REQUEST['pie'];?>;
}
function timeGreeting()
{
window.setTimeout(go_to_url, <?php echo $_REQUEST['seq'];?> );
//milliseconds to load next page.
}
timeGreeting();
</script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../js/highcharts.js"></script>
<script type="text/javascript" src="../js/pie.js"></script>
<script type="text/javascript">
var myfile='<?php echo $project_files[$pie1];?>';
var options1 = {
chart: {
renderTo: 'container1',
defaultSeriesType: 'pie',
spacingTop: 10,
spacingBottom: 5,
spacingLeft: 5,
spacingRight: 5
},
title: {
text: '<?php echo $projectname1[0];?>'
},
plotOptions: {
pie: {
size:'74%',
allowPointSelect: false,
cursor: 'pointer',
showInLegend: false,
dataLabels: {
rotation: 0,
distance: 10,
enabled: true,
color: '#2f7ed8',
formatter: function() {
if(this.y == 0)
return null
else
return this.point.name + ' [ ' + Highcharts.numberFormat(this.y, 0) + ' ]';
}
}
}
},
legend: {
enabled: true,
layout: 'vertical',
align: 'right',
width: 200,
verticalAlign: 'middle',
useHTML: true,
borderWidth: 5,
borderRadius: 10,
labelFormatter: function() {
return '<div style="text-align: left; width:130px;">' + this.name + '</div><div style="width:40px; text-align:right;">' + this.y + '%</div>';
}
},
series : []
};
var myfile='<?php echo '../data/project/'.$project_files[$pie1];?>';
$.get(myfile,function(data) {
// Split the lines
var lines = data.split(';');
var series = {
dataLabels: {
enabled: true,
style: {
color: '#000000',
fontFamily: 'verdana',
fontSize: '12px',
lineHeight: '21px'
}},
data: []
};
// Iterate over the lines and add categories or series
$.each(lines, function(lineNo,line) {
var items = line.split(',');
series.data.push({
type:'pie',
name: items[0],
y:parseFloat(items[1])
});
});
options1.series.push(series);
// Create the chart
var chart = new Highcharts.Chart(options1);
});
</script>
<script type="text/javascript">
var myfile='<?php echo '../data/project/'.$project_files[$pie2];?>';
var options2 = {
chart: {
renderTo: 'container2',
defaultSeriesType: 'pie',
spacingTop: 10,
spacingBottom: 5,
spacingLeft: 5,
spacingRight: 5
},
title: {
text: '<?php echo $projectname2[0];?>'
},
plotOptions: {
pie: {
size:'74%',
allowPointSelect: false,
cursor: 'pointer',
showInLegend: false,
dataLabels: {
rotation: 0,
distance: 10,
color: '#2f7ed8',
enabled: true,
formatter: function() {
if(this.y == 0)
return null
else
return this.point.name + ' [ ' + Highcharts.numberFormat(this.y, 0) + ' ]';
}
}
}
},
colors: [
'#4572A7',
'#AA4643',
'#DB843D'
],
series : []
};
$.get(myfile,function(data) {
// Split the lines
var lines = data.split(';');
var series = {
dataLabels: {
enabled: true,
style: {
color: '#000000',
fontFamily: 'verdana',
fontSize: '12px',
lineHeight: '21px'
}},
data: []
};
// Iterate over the lines and add categories or series
$.each(lines, function(lineNo,line) {
var items = line.split(',');
series.data.push({
type:'pie',
name: items[0],
y:parseFloat(items[1])
});
});
options2.series.push(series);
// Create the chart
var chart = new Highcharts.Chart(options2);
});
</script>
<script type="text/javascript">
var myfile='<?php echo '../data/project/'.$project_files[$pie3];?>';
var options3 = {
chart: {
renderTo: 'container3',
defaultSeriesType: 'pie',
spacingTop: 10,
spacingBottom: 5,
spacingLeft: 5,
spacingRight: 5
},
title: {
text: '<?php echo $projectname3[0];?>'
},
plotOptions: {
pie: {
size:'74%',
allowPointSelect: false,
cursor: 'pointer',
showInLegend: false,
dataLabels: {
rotation: 0,
distance: 10,
color: '#2f7ed8',
enabled: true,
formatter: function() {
if(this.y == 0)
return null
else
return this.point.name + ' [ ' + Highcharts.numberFormat(this.y, 0) + ' ]';
}
}
}
},
colors: [
'#4572A7',
'#AA4643',
'#DB843D'
],
series : []
};
$.get(myfile,function(data) {
// Split the lines
var lines = data.split(';');
var series = {
dataLabels: {
enabled: true,
style: {
color: '#000000',
fontFamily: 'verdana',
fontSize: '12px',
lineHeight: '21px'
}},
data: []
};
// Iterate over the lines and add categories or series
$.each(lines, function(lineNo,line) {
var items = line.split(',');
series.data.push({
type:'pie',
name: items[0],
y:parseFloat(items[1])
});
});
options3.series.push(series);
// Create the chart
var chart = new Highcharts.Chart(options3);
});
</script>
<script type="text/javascript">
var myfile='<?php echo '../data/project/'.$project_files[$pie4];?>';
var options4 = {
chart: {
renderTo: 'container4',
defaultSeriesType: 'pie',
spacingTop: 10,
spacingBottom: 5,
spacingLeft: 5,
spacingRight: 5
},
title: {
text: '<?php echo $projectname4[0];?>'
},
plotOptions: {
pie: {
size:'74%',
allowPointSelect: false,
cursor: 'pointer',
showInLegend: false,
dataLabels: {
rotation: 0,
distance: 10,
color: '#2f7ed8',
enabled: true,
formatter: function() {
if(this.y == 0)
return null
else
return this.point.name + ' [ ' + Highcharts.numberFormat(this.y, 0) + ' ]';
}
}
}
},
colors: [
'#4572A7',
'#AA4643',
'#DB843D'
],
series : []
};
$.get(myfile,function(data) {
// Split the lines
var lines = data.split(';');
var series = {
dataLabels: {
enabled: true,
style: {
color: '#000000',
fontFamily: 'verdana',
fontSize: '12px',
lineHeight: '21px'
}},
data: []
};
// Iterate over the lines and add categories or series
$.each(lines, function(lineNo,line) {
var items = line.split(',');
series.data.push({
type:'pie',
name: items[0],
y:parseFloat(items[1])
});
});
options4.series.push(series);
// Create the chart
var chart = new Highcharts.Chart(options4);
});
</script>
</head>
<body>
<?php include('header.php');?>
<table border='0' width='100%'>
<tr>
<td width='50%' align='right' valign='top'>
<?php include('pie1.php');?>
</td>
<td width='50%' align='right' valign='top'>
<?php include('pie2.php');?>
</td>
</tr>
<tr>
<td width='50%' align='right' valign='top'>
<?php include('pie3.php');?>
</td>
<td width='50%' align='right' valign='top'>
<?php include('pie4.php');?>
</td>
</tr>
</table>
</body>
</html>
AFLS问题摘要
函数go_to_url（）
{
document.location.href='？pgco='+'&pie='+'；
}
函数timeGreeting（）
{
setTimeout（转到url，）；
//毫秒以加载下一页。
}
时间问候（）；
var myfile=''；
变量选项1={
图表：{
renderTo:'container1'，
defaultSeriesType:'pie'，
间距：10，
间距底部：5，
间距：5，
间距：5
},
标题：{
文本：“”
},
打印选项：{
馅饼：{
大小：'74%'，
allowPointSelect:false，
光标：“指针”，
showInLegend:false，
数据标签：{
轮换：0，
距离：10，
启用：对，
颜色：“#2f7ed8”，
格式化程序：函数（）{
if（this.y==0）
返回空
其他的
返回this.point.name+'['+Highcharts.numberFormat（this.y，0）+']'；
}
}
}
},
图例：{
启用：对，
布局：“垂直”，
对齐：“右”，
宽度：200，
垂直排列：'中间'，
是的，
边框宽度：5，
边界半径：10，
labelFormatter:function（）{
返回'+this.name+''+this.y+'%'；
}
},
系列：[]
};
var myfile=''；
$.get（我的文件，函数（数据）{
//分道扬镳
变量行=data.split（“；”）；
变量系列={
数据标签：{
启用：对，
风格：{
颜色：'#000000'，
fontFamily：“verdana”，
fontSize:'12px'，
线宽：“21px”
}},
数据：[]
};
//迭代行并添加类别或系列
$.each（行，函数）（行号，行）{
var items=line.split（'，'）；
series.data.push({
类型：'pie'，
名称：项目[0]，
y:parseFloat（项目[1]）
});
});
选项1.系列。推送（系列）；
//创建图表
var图表=新的高点图表。图表（选项1）；
});
var myfile=''；
var选项2={
图表：{
renderTo:'container2'，
defaultSeriesType:'pie'，
间距：10，
间距底部：5，
间距：5，
间距：5
},
标题：{
文本：“”
},
打印选项：{
馅饼：{
大小：'74%'，
allowPointSelect:false，
光标：“指针”，
showInLegend:false，
数据标签：{
轮换：0，
距离：10，
颜色：“#2f7ed8”，
启用：对，
格式化程序：函数（）{
if（this.y==0）
返回空
其他的
返回this.point.name+'['+Highcharts.numberFormat（this.y，0）+']'；
}
}
}
},
颜色：[