在与HTML中的菜单栏集成时，div标记不可见
在与HTML中的菜单栏集成时，div标记不可见
提问于 2013-12-05 01:17:33
我已经使用高图表jquery库制作了一个图表，当它只在jsp页面中时，.My图表是可见的，但是当我试图将它与我的菜单栏页面集成时，它给出了不显示图表。我没有得到我错的地方...
我试着查看Firebug中的错误，但一切都很好，因为数据来自服务器端代码。
这是我的jsp页面的头部内容..
<script type="text/javascript">
var dbdata="";
var fancy_array = [];
$(document).ready(function() {
$.ajax({
type: 'GET',
url: 'getPieChartcallcountbysite',
async:false,
dataType: "text",
success: function(data) {
dbdata=JSON.parse(data);
var i;
for(i = 0; i < dbdata.length;i=i+2)
{
var item = [dbdata[i], dbdata[i+1]];
fancy_array.push(item);
}
console.log(fancy_array);
}
});
});
$(function () {
$('#container').highcharts({
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Graphical Analysis of CallBilling, 2013'
},
tooltip: {
pointFormat: "CallCount {point.y:.0f}"
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
format: '<b>{point.name}</b>: {point.percentage:.1f} %'
}
}
},
series: [{
type: 'pie',
name: 'Call Type',
data:fancy_array
}],
credits: {
enabled: false
},
exporting: { enabled: false }
});
});
</script>这是我的身体内容。
<div id="menu">
<ul class="menu">
<li><a href="Home.aspx" class="parent"><span>Home</span></a>
</li>
<li><a href="#" class="parent"><span>Reports</span></a>
<div><ul>
<li><a href="#" class="parent"><span>Details</span></a>
<div><ul>
<li><a href="daterange.jsp" >Generic Detail Report</a></li>
<li><a href="Extension.jsp">ExtensionWise Report</a></li>
<li><a href="Trunk.jsp">TrunkWise Report</a></li>
<li><a href="Department.jsp">DepartmentWise Report</a></li>
<li><a href="WWIDwise.jsp">WWIDwise Report</a></li>
<li><a href="site.jsp">Sitewise Report</a></li>
<li><a href="ServiceProvider.jsp">ServiceProviderwise Report</a></li>
<li><a href="TOPNUSER.jsp">Top N User Report</a></li>
<li><a href="DetailCountry.jsp">Countrywise Report</a></li>
</ul></div>
</li>
</ul>
</li>
</ul>
</div>
<br/>
<div id="container" style="width:550px; height: 200px; margin:0 auto"></div>请帮我找出问题所在。我完全陷入了这种境地。先谢谢你...
回答 2
Stack Overflow用户
发布于 2013-12-05 01:34:03
如果它只在没有<div id="menu"> ... </div>块的情况下工作，我认为it会有冲突，方法是将#menu更改为更独特的菜单。
Stack Overflow用户
发布于 2013-12-05 19:56:30
您需要在AJAX中初始化图表，在单独的$(函数)中...此外，$(函数与$(文档).ready()相同。因此，请检查这是否可以工作：
var dbdata="";
var fancy_array = [];
$(document).ready(function() {
$.ajax({
type: 'GET',
url: 'getPieChartcallcountbysite',
async:false,
dataType: "text",
success: function(data) {
dbdata=JSON.parse(data);
var i;
for(i = 0; i < dbdata.length;i=i+2)
{
var item = [dbdata[i], dbdata[i+1]];
fancy_array.push(item);
}
console.log(fancy_array);
$('#container').highcharts({
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Graphical Analysis of CallBilling, 2013'
},
tooltip: {
pointFormat: "CallCount {point.y:.0f}"
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
format: '<b>{point.name}</b>: {point.percentage:.1f} %'
}
}
},
series: [{
type: 'pie',
name: 'Call Type',
data:fancy_array
}],
credits: {
enabled: false
},
exporting: { enabled: false }
});
}
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/20381740
复制相关文章
相似问题
腾讯云开发者
