2013-12-04 4 views
0

Я не могу найти tickOption для dateAxisRenderer.X Ось метки этикетки в dateAxisRenderer

Я пробовал следующим образом:

axes:{ 
axesDefaults:{tickRenderer : $.jqplot.CanvasAxisTickRenderer, tickOptions :{angle: -30}}, 
xaxis:{ 
renderer: $.jqplot.DateAxisRenderer, 
tickOptions:{ 
angle: -30, 
formatString:'%H:%M' 
}, 
} 
} 

но это din't похоже на работу. Может кто-то, пожалуйста, помогите мне с этим.

ответ

1

Вам нужно добавить rendererOptions: {tickRenderer: $ .jqplot.CanvasAxisTickRenderer} в XAxis определения:

axes:{ 
axesDefaults:{ 
    tickRenderer : $.jqplot.CanvasAxisTickRenderer, 
    tickOptions :{angle: -30} 
}, 
xaxis:{ 
    renderer:$.jqplot.DateAxisRenderer, 
    rendererOptions:{      
    tickRenderer:$.jqplot.CanvasAxisTickRenderer 
    }, 
    ticks: xTicks, 
    tickOptions: { 
    angle: -30, 
    formatString: '%H:%M' 
    }, 
} 
} 

Пожалуйста, смотрите рабочий пример here

+0

Это работает, спасибо за быструю помощь – user3065436

+0

добро пожаловать :) – AnthonyLeGovic

0

первый: добавить CSS и JS в вашем коде :

<link class="include" rel="stylesheet" type="text/css" href="jquery.jqplot.min.css" /> 
<link rel="stylesheet" type="text/css" href="examples.min.css" /> 
<link type="text/css" rel="stylesheet" href="syntaxhighlighter/styles/shCoreDefault.min.css" /> 
<link type="text/css" rel="stylesheet" href="syntaxhighlighter/styles/shThemejqPlot.min.css" /> 


<!--[if lt IE 9]><script language="javascript" type="text/javascript" src="../excanvas.js"></script><![endif]--> 
<script class="include" type="text/javascript" src="jquery.min.js"></script> 

    <script class="include" type="text/javascript" src="jquery.jqplot.min.js"></script> 
    <script type="text/javascript" src="syntaxhighlighter/scripts/shCore.min.js"></script> 
    <script type="text/javascript" src="syntaxhighlighter/scripts/shBrushJScript.min.js"></script> 
    <script type="text/javascript" src="syntaxhighlighter/scripts/shBrushXml.min.js"></script> 
    <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.dateAxisRenderer.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.canvasAxisTickRenderer.min.js"></script> 

второй: HTML-код:

<div id="chartdiv" style="height:400px;width:300px; "></div> 

третий: Jquery код:

<script class="code" type="text/javascript"> 
$(document).ready(function(){ 
    var line1 = [['Cup Holder Pinion Bob', 7], ['Generic Fog Lamp', 9], ['HDTV Receiver', 15], 
    ['8 Track Control Module', 12], [' Sludge Pump Fourier Modulator', 3], 
    ['Transcender/Spice Rack', 6], ['Hair Spray Danger Indicator', 18]]; 
    var plot3 = $.jqplot('chart3', [line1], { 
    title: 'Concern vs. Occurrance', 
    series:[{renderer:$.jqplot.BarRenderer}], 
    axesDefaults: { 
     tickRenderer: $.jqplot.CanvasAxisTickRenderer, 
     tickOptions: { 
      angle: -30 
     } 
    }, 
    axes: { 
     xaxis: { 
     renderer: $.jqplot.CategoryAxisRenderer, 
     tickOptions: { 
      labelPosition: 'middle' 
     } 
     }, 
     yaxis: { 
     autoscale:true, 
     tickRenderer: $.jqplot.CanvasAxisTickRenderer, 
     tickOptions: { 
      labelPosition: 'start' 
     } 
     } 
    } 
    }); 
}); 
</script> 
Смежные вопросы