Hi sir,
I want to increase my gantt chart x axis event name font size and y axis time line font size.
here is my code.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm6.aspx.cs" Inherits="WebApplication3.WebForm6" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" type="text/css" href="https://demo.plantpot.works/assets/css/normalize.css">
<link rel="stylesheet" href="https://use.typekit.net/opg3wle.css">
<link rel="stylesheet" type="text/css" href="report.css"/>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
</head>
<body>
<script type="text/javascript">
google.charts.load('current', { 'packages': ['gantt'] });
//google.charts.setOnLoadCallback(drawChart);
$("[id*=btnView]").on("click", function () {
drawChart();
return false;
});
function drawChart() {
var obj = {};
obj.flightNo = $.trim($("[id*=flightNo]").val());
obj.flightDate = $.trim($("[id*=flightDate]").val());
obj.flightType = $.trim($("[id*=flightType]").val());
$.ajax({
type: "POST",
url: "WebForm6.aspx/GetChartData",
data: JSON.stringify(obj),
contentType: "application/json;charset=utf-8",
dataType: "json",
success: function (response) {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Task ID');
data.addColumn('string', 'Task Name');
data.addColumn('string', 'Resource');
data.addColumn('date', 'Start Date');
data.addColumn('date', 'End Date');
data.addColumn('number', 'Duration');
data.addColumn('number', 'Percent Complete');
data.addColumn('string', 'Dependencies');
for (var i = 0; i < response.d.length; i++) {
var taskId = "Task_" + response.d[i][0].toString();
var taskName = response.d[i][1].toString();
var resource = response.d[i][1].toString();
var startDate = new Date(response.d[i][2].toString());
var enddate = new Date(response.d[i][3].toString());
var duration = parseInt("100");
var percentageComplete = parseInt("100");
var dependencies = "";
data.addRows([[taskId, taskName, resource, startDate, enddate, duration, percentageComplete, dependencies]]);
}
var options = {
height: 1000, gantt: { trackHeight: 30 }
};
var chart = new google.visualization.Gantt(document.getElementById('chart_div'));
chart.draw(data, options);
}, error: function (response) {
alert(response.responseText);
}
});
}
</script>
</body>
</html>
