CODEWITHSUNDEEP
jqueryjqplot
Tarika
Tarika

Reputation: 246

how to show dotted grid lines in jqplot instead of solid lines

$(document).ready(function(){
  // Our data renderer function, returns an array of the form:
  // [[[x1, sin(x1)], [x2, sin(x2)], ...]]
  var sineRenderer = function() {
    var data = [[]];
    for (var i=0; i<13; i+=0.5) {
      data[0].push([i, Math.sin(i)]);
    }
    return data;
  };

  // we have an empty data array here, but use the "dataRenderer"
  // option to tell the plot to get data from our renderer.
  var plot1 = $.jqplot('chart1',[],{
      title: 'Sine Data Renderer',
      dataRenderer: sineRenderer
  });
});

In this chart i have to set dotted grid lines in background. is this possible to draw dotted grid lines in jqplot

Upvotes: 3

Views: 986

Answers (1)

frost
frost

Reputation: 1143

I don't know whether an easier way to accomplish this exists, but this works:

Open jquery.jqplot.js. In function $.jqplot.CanvasGridRenderer.prototype.draw add line ctx.setLineDash([1, 5]); after line ctx.save();. Then just minimize the file, save it as jquery.jqplot.min.js (or apply those changes directly on minimized version) and you're good to go.

Bear in mind that all your charts will have dotted lines now. If that's a problem, then you would need to add a new property to Grid class like lineDash and process it accordingly in $.jqplot.CanvasGridRenderer.prototype.draw.

enter image description here

Upvotes: 2

Related Questions