javascript - Remove blank space below and above google graph? -
i have used google graph on particular page after few contents. number of rows(data) in google graph increases, space between content , graph increases. have tried modify height, no result.
here code -
function drawchart() { var data = new google.visualization.datatable(); data.addcolumn('string', 'projects'); data.addcolumn('number', 'hours'); var monthdata = jquery(".slick-active").html(); var monthtemp = monthdata.tostring().split(" "); var month = getmonthfromstring(monthtemp[0]); var year = monthtemp[1]; var tag = $("#tagval").val(); var jsondata = jquery.ajax({ url: "/report/additionalprojecthours", type: "post", datatype: "json", async: false, data: {month: month, year: year, tag:tag}, beforesend: function (request) { return request.setrequestheader('x-csrf-token', $("meta[name='token']").attr('content')); }, error: function () { //alert("errorrrrrr"); } }).responsetext; var options; var chartheight; if ((jsondata.length) > 134) { if (jsondata.length < 200){ chartheight = 250; }else{ chartheight =jsondata.length ; } var options = { height: chartheight / 1.3 - 100, color: "#0f00ff", fontname: "times-roman", fontsize: 15, bold: true, series: { 0: { visibleinlegend: false } }, bar: { groupwidth: '20%' } }; var data = new google.visualization.datatable(jsondata); // instantiate , draw our chart, passing in options. var chart = new google.visualization.barchart(document.getelementbyid('chart')); chart.draw(data, options); }else { $("#chart").html('<p style="margin-right: 70px;font-family: times-roman; text-align: center; padding: 20px;">no data available</p>'); } $('defs').nextall("g").eq(1).hide(); }
i expect problem here:
chartheight =jsondata.length ;
jsondata
string, setting height of chart equal number of characters in string. try setting height based on number of rows of data in datatable instead:
var data = new google.visualization.datatable(jsondata); options.height = data.getnumberofrows() * <height per row> + <offset chart header , footer>;
Comments
Post a Comment