dateaxisrenderer不会在我的代码中呈现

时间:2012-12-18 01:34:41

标签: javascript jquery-ui graph primefaces jqplot

我正在使用primefaces 3.4.2。由于primefaces不提供对y2axis的支持,我使用的是由primefaces提供的jqplot并在函数中编写代码。我能够获取y2axis但是无法检索x轴的日期。

我也称为渲染器:$ .jqplot.DateAxisRenderer,

。我甚至没有xaxis上的错误或值。当我有数字时,我确实在x轴上看到了值。

1 个答案:

答案 0 :(得分:0)

<ui:composition 

    <!-- Contextual Actions Menu -->
    <h:outputScript library="components" name="sso.js" target="body"/>

    <h:outputScript name="charts/charts.js" library="primefaces" target="head"/>
    <h:outputScript name="jquery/jquery.js" library="primefaces" target="body"></h:outputScript>

    <h:outputScript library="primefaces" name="plugins/jqplot.dateAxisRenderer.min.js" target="body"></h:outputScript>
    <h:outputScript library="primefaces" name="plugins/jqplot.dateAxisRenderer.js" target="body"></h:outputScript>

    <ui:define name="body">

    <!-- <p:outputPanel layout="block">-->


    <script type="text/javascript">
    $(document).ready(function(){

            var line1= [['2008-09-30 4:00PM',10], ['2008-10-30 4:00PM',20], ['2008-11-30 4:00PM',35], ['2008-12-30 4:00PM',31], ['2009-01-30 4:00PM',50]]; 
            var line2= [['2008-09-30 4:00PM',100], ['2008-10-30 4:00PM',200], ['2008-11-30 4:00PM',300], ['2008-12-30 4:00PM',450], ['2009-01-30 4:00PM',500]];  

            <!--   var line1=[[12,10], [18,20], [24,30], [30,40], [36,50]]; --> 
            <!--   var line2=[[14,100], [14,200], [20,300], [12,400], [30,500]]; --> 

    $.jqplot.config.enablePlugins= true;

     plot1=$.jqplot('chart1',[line2, line1], {

    title:'AUM vs Revenue',

    axesDefaults: {
        tickRenderer: $.jqplot.CanvasAxisTickRenderer,

    },


    axes:{
     xaxis:{


        renderer:$.jqplot.DateAxisRenderer  

        <!--min:'2008-09-30', -->
        <!-- tickInterval:'1 month', --> 
        <!-- tickOptions:{formatString:'%b %#d, %y'}, -->
        <!--label: "Time Period", -->
        <!--labelRenderer: $.jqplot.CanvasAxisLabelRenderer -->


       <!--  min:0, --> 
       <!--  tickInterval:10 --> 

       },
       yaxis:{
           labelOptions: {
               textColor : '#3988BD'},
               tickOptions:{textColor : '#3988BD'},
           tickInterval:100,
           min:0,
          label: "AUM",
          labelRenderer: $.jqplot.CanvasAxisLabelRenderer

       },
       y2axis:{labelOptions: {
           textColor : '#E0981B'},
           tickOptions:{textColor : '#E0981B'},
           tickInterval:10,
           min:0,
         label:"Revenue",
         labelRenderer: $.jqplot.CanvasAxisLabelRenderer, 
          renderOptions:{alignTicks:true}
       }

    },

     grid: {
                    borderColor: "#fff",
                    background: "#FFF",
                    drawGridlines: true,
                    shadow: true
                }, 
    series:[
            {lineWidth:4}, {yaxis:'y2axis'}
       ],   
     cursor:{
      show: true,
      zoom:true,
      showTooltip:true
    },
    });
}); 
</script>