CODEWITHSUNDEEP
jqplot
Vlad
Vlad

Reputation: 119

jqplot horizontal line

Can't seem to get horizontal line to show up, I've looked at previous posts, but nothing there that works... Maybe I'm missing an import? The graph itself shows up well.

    $(document).ready(function(){
    var line1 = [['January', 1], ['February', 2], ['March', 3],
    ['April', 4], ['May', 5], ['June', 6], ['July', 7], ['August', 8],
    ['September', 9], ['October', 10], ['November', 11], ['December', 12]];
    //alert(<?=$graph[1]['st']?>);
    var plot1 = $.jqplot('settle_graph', [line1], {
        title: 'Monthly Settlements',
        grid:{drawBorder: false, shadow:false},
        canvasOverlay: {
          show: true,
          objects: [
            {horizontalLine: {
              name: '# Settlements from Budget',
              y: 6,
              lineWidth: 3,
              color: '#444444',
              shadow: true,
              show:true,                  
              lineCap: 'butt',
              xOffset: 0
            }}
          ]
        },     
        series:[{renderer:$.jqplot.BarRenderer}],
        seriesDefaults: {
            rendererOptions: {
                varyBarColor : true,
                barPadding: 2,      // number of pixels between adjacent bars in the same
                                    // group (same category or bin).
                barMargin: 3,      // number of pixels between adjacent groups of bars.
                barDirection: 'vertical', // vertical or horizontal.
                barWidth: null//,     // width of the bars.  null to calculate automatically.
                //shadowOffset: 2,    // offset from the bar edge to stroke the shadow.
                //shadowDepth: 5,     // nuber of strokes to make for the shadow.
                //shadowAlpha: 0.8,   // transparency of the shadow.
            }
        },
        axesDefaults: {
            tickRenderer: $.jqplot.CanvasAxisTickRenderer ,         
            tickOptions: {
              angle: -30,
              fontSize: '10pt'            
            },rendererOptions: {
                baselineWidth: 1,
                baselineColor: '#444444',
                drawBaseline: true
            }
        },
        axes: {         
            xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer,
                tickOptions:{
                    showGridline: false             
                }                           
            },
            yaxis: {            
                tickOptions:{
                    showGridline: false
                }               
            }           
        },
    seriesColors: ["#4FCBEA", "#4FCBEA", "#4FCBEA", "#4FCBEA", 
    "#4FCBEA", "#4FCBEA", "#4FCBEA", "#4FCBEA", 
    "#4FCBEA", "#4FCBEA", "#4FCBEA", "#4FCBEA"],        
  });     
});

Anyone done the simple horizontal line before?

Upvotes: 4

Views: 3253

Answers (2)

Vlad
Vlad

Reputation: 119

Thanks SDESPONT, figured it was missing this morning by looking at what's in the plugins folder :)

    <script type="text/javascript" 
  src="jqplot/plugins/jqplot.canvasOverlay.min.js"></script>

I wish SO emailed me your reply :)

Upvotes: 1

sdespont
sdespont

Reputation: 14025

You need to include the jqplot.canvasOverlay.js plugin to display overlay

Upvotes: 8

Related Questions