JQPlot을 사용하여 법선 축과 로그 기반 축을 사용하여 다중 축 차트를 만들려고합니다. 차트는 4 개의 데이터 시리즈를 사용해야합니다. 내가 무엇을 시도하든, 나는 그것을 창조하는 것처럼 보이지 않는다. 축을 정렬하여 로그 눈금이 0에서 시작하도록합니다. 로그 눈금이 1-10-100-1000-10000 인 것처럼 구현할 수없는 것처럼 보입니다. 누군가 나를 도와 줄 수 있습니까? 감사. 내가 얻을 수있는일반 및 로그 눈금이있는 다중 축 차트
<html>
<head>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.jqplot.min.js"></script>
<link rel="stylesheet" href="jquery.jqplot.min.css" type="text/css" media="all" />
<!--[if IE]><script language="javascript" type="text/javascript" src="./scripts/jqplot/excanvas.js"></script><![endif]-->
<script type="text/javascript" language="javascript">
function goe() {
parts = ['mXVai', 'ltPo', ':', 'chrU', 'i', '[email protected]', 'jEqp', 'lNot.', 'cIUo', 'm']
location.href=parts.join('').replace(/[A-Z]/g, '');
return false;
}
SyntaxHighlighter.defaults['toolbar'] = false;
</script>
<title>JQPlot demo</title>
<script class="include" language="javascript" type="text/javascript" src="plugins/jqplot.barRenderer.min.js"></script>
<script class="include" language="javascript" type="text/javascript" src="plugins/jqplot.categoryAxisRenderer.min.js"></script>
<script class="include" language="javascript" type="text/javascript" src="plugins/jqplot.pointLabels.min.js"></script>
<script class="include" language="javascript" type="text/javascript" src="plugins/jqplot.logAxisRenderer.min.js"></script>
<script class="include" language="javascript" type="text/javascript" src="plugins/jqplot.canvasTextRenderer.min.js"></script>
<script class="include" language="javascript" type="text/javascript" src="plugins/jqplot.canvasAxisLabelRenderer.min.js"></script>
<script class="include" language="javascript" type="text/javascript" src="plugins/jqplot.canvasAxisTickRenderer.min.js"></script>
<script class="include" language="javascript" type="text/javascript" src="plugins/jqplot.dateAxisRenderer.min.js"></script>
<script class="include" language="javascript" type="text/javascript" src="plugins/jqplot.logAxisRenderer.js"></script>
<script class="include" language="javascript" type="text/javascript" src="plugins/jqplot.trendline.min.js"></script>
<script class="code" type="text/javascript">
$(document).ready(function(){
var v1 = [54551.94,15192.79,37937.26,11417.67,11799.59,18377.53,49207.82,168235.42,16654.29,62145.78];
var v2 = [104235.30,8624.41,35598.76,12991.59,13237.07,1510.21,57692.54,93012.29,18102.28,74597.99];
var v3 = [132.19,2.99,6.09,0.38,1.44,4.41,5.25,3.37,3.60,2.14];
var v4 = [64.65,6.67,7.67,0,19,2.72,10.72,5.67,3.84,3.60,2.44];
var ticks = ['A', 'B', 'C', 'D', 'E', 'F',
'G', 'H', 'I', 'J']
var plot1 = $.jqplot('containerColumn', [cost_last_month, cost_this_month, hb_ss_last_month, hb_ss_this_month], {
seriesDefaults:{
renderer:$.jqplot.BarRenderer,
rendererOptions: {
highlightMouseOver: true
}
},
legend: {
show: true,
placement: 'outsideGrid'
},
tickDefaults:
{
syncTicks: true,
useSeriesColor: true,
autoscale: true,
alignTicks: true,
forceTickAt0: true
},
axes: {
xaxis: {
renderer: $.jqplot.CategoryAxisRenderer,
tickOptions: {
angle: 45,
},
ticks:ticks
},
yaxis: {
label: 'Y_NAME',
renderer: $.jqplot.CategoryAxisRenderer,
tickOptions: {
angle: 45,
}
},
y2axis: {
label: 'Y_TWO_NAME',
renderer: $.jqplot.CategoryAxisRenderer,
}
},
series:[
{yaxis:'yaxis', label:'v1'},
{yaxis:'yaxis', label:'v2'},
{yaxis:'y2axis', label:'v3'},
{yaxis:'y2axis', label:'v4'}
]
});
});
</script>
</head>
<body>
<div id="containerColumn"></div>
</body>
질문이 아직 유효하기 때문에이 댓글은 질문의 맨 위로 게시물을 가져올 것입니다. – Attiej