1
내가 렌더링 않은 jqPlot 및 파이 차트를 사용하여 원형 차트를 만든
이, 내 코드는 내가 직면하고jqPlot 원형 차트 렌더링은되지만 던져 버리고 오류가 발생하고 이상하게 보입니까?
var plot4 = $.jqplot('pie', [[["none",10],["error",20],["click",30],["impression",40]]], {
seriesDefaults:{
renderer:$.jqplot.PieRenderer,
rendererOptions:{ sliceMargin: 0 }
},
legend:{ show: true }
});
문제 아래에 언급하는 것은 내가 파이 차트 위에 마우스를 할 때 내가
을 알리는 오류를 얻을 수 있다는 것입니다B.axes[D[0]]._ticks[0] is undefined
방화 광 콘솔에서. 원형 차트의 슬라이스 중 하나를 클릭하면 클릭 한 전체 슬라이스가 사라지는 훨씬 더 이상한 현상이 나타납니다. 다음과 같이
은 클릭하기 전에 파이 차트는 같습니다 -
을 나는 아래, 심지어 갈색 슬라이스가 사라질 파이 뭔가 것으로 판명 갈색 지역을 클릭 한 후.
위를위한 솔루션을 제공하십시오. 나는 다른 구성을 시험해 보았지만 딘의 작업. 또한이 페이지에서 막대 그래프와 커서와 같은 다른 플러그인을 사용하고 있다고 알려 드리겠습니다.
내가이 일을하고 어디 내 페이지의 전체 소스 코드를 아래에 언급 한 -
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>jqPlot Demo</title>
<!--[if IE]><script src="./js/excanvas.min.js"></script><![endif]-->
<script type="text/javascript" src="./js/jquery.min.js"></script>
<script type="text/javascript" src="./js/jquery.jqplot.js"></script>
<script type="text/javascript" src="./js/jqplot.cursor.min.js"></script>
<script type="text/javascript" src="./js/jqplot.dragable.min.js"></script>
<script type="text/javascript" src="./js/jqplot.trendline.min.js"></script>
<script type="text/javascript" src="./js/jqplot.barRenderer.min.js"></script>
<script type="text/javascript" src="./js/jqplot.pieRenderer.min.js"></script>
<script type="text/javascript" src="./js/jqplot.canvasAxisLabelRenderer.min.js"></script>
<script type="text/javascript" src="./js/jquery-ui.min.js"></script>
<link rel="stylesheet" href="./css/jquery.jqplot.min.css"/>
<link rel="stylesheet" href="./css/jqPlot.css"/>
<script>
$(document).ready(function(){
$.jqplot.config.enablePlugins = true;
var lineGraph=$.jqplot('chart', [[[10, 2],[30,5.12],[50,13.1],[70,33.6],[90,85.9],[11,20.9]]],
{
title:'Exponential Line',
axes:{yaxis:{min:0,max:100},xaxis:{min:0,max:100}},
legend:{
show:true,
location:'se',
xoffset:12,
yoffset:0
},
grid:{
gridLineColor:'#F2F2F2',
background:'#FFFFFF',
borderWidth:1,
borderColor:'#BBBBBB',
shadow:true,
shadowAmgle:45,
shadowWidth:2,
shadowOffset:2,
shadowDepth:2
},
cursor:{
style: 'pointer',
show:false,
showTooltip: true,
followMouse:true,
tooltipOffset:10,
tooltipLocation:'se'
},
highlighter: {
lineWidthAdjust: 2.5,
sizeAdjust: 5,
showTooltip: true,
tooltipLocation: 'nw',
fadeTooltip: true,
tooltipFadeSpeed: "fast",
tooltipOffset: 2,
tooltipAxes: 'both',
tooltipSeparator: ', ',
useAxesFormatters: true,
tooltipFormatString: '%.5P'
},
seriesDefaults:{
trendline:{
show:true,
color:'#A2D379',
lable:'trendX',
lineWidth:2,
shadow:true
},
color:'#058DC7',
lineWidth:5,
fill:true,
fillAndStroke:true,
fillColor:'#E6F4F9'
}
});
var plot4 = $.jqplot('pie', [[["none",10],["error",20],["click",30],["impression",40]]], {
seriesDefaults:{
renderer:$.jqplot.PieRenderer,
rendererOptions:{ sliceMargin: 0 }
},
legend:{ show: true },
cursor: {
show: false
}
});
});
$('document').ready(function(){
$('.column').sortable({
connectWith:'.column',
handle:'h2',
cursor:'move',
placeholder:'placeholder',
forcePlaceholderSize:true,
opacity:0.4,
revert:true
}).disableSelection();
}
);
</script>
</head>
<body>
<div class="column" id="column1">
<div class="dragbox" id="item1" >
<h2>Handle 1</h2>
<div class="dragbox-content" >
<div id="chart" style="width:100%;height:100%;float:left"></div>
</div>
</div>
</div>
<div class="column" id="column1">
<div class="dragbox" id="item1" >
<h2>Handle 1</h2>
<div class="dragbox-content" >
<div id="pie" style="width:100%;height:100%;float:left"></div>
</div>
</div>
</div>
<div class="column" id="column1">
<div class="dragbox" id="item1" >
<h2>Handle 1</h2>
<div class="dragbox-content" >
<div id="chart1" style="width:400px;height:300px;float:left"></div>
</div>
</div>
</div>
<div id="barRender" style="width:400px;height:300px;float:left"></div>
</body>
</html>
JavaScript 파일에 문제가있는 경우 또는 파일에 예상되는 방화 광이 가리키는 것과 같은 것이없는 경우 오류가 발생하더라도 평소대로 JavaScript 링크가 아래에 있습니다. 회신 해 주셔서 감사합니다. jqplot.cursor.min.js –