...
Html |
---|
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load("current", {
packages: ["calendar"]
});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var query = new google.visualization.Query(" https://docs.google.com/spreadsheets/d/1Hoh_oTwaDPEqeoOC9Taqnp0qgQKdLzPH8lBv-DF60Gg/gviz/tq?range=A2:B");
query.send(handleQueryResponse);
}
function handleQueryResponse(response) {
var data = response.getDataTable();
var chart = new google.visualization.Calendar(document.getElementById('calendar_basic'));
var options = {
//title: "Houghton Technical Services",
height: 350,
noDataPattern: {
backgroundColor: '#fff',
color: '#fff'
},
calendar: {
monthOutlineColor: {
stroke: '#fff',
strokeOpacity: 0.5,
strokeWidth: 1,
},
unusedMonthOutlineColor: {
stroke: '#fff',
strokeOpacity: 0.5,
strokeWidth: 1,
},
cellColor: {
stroke: '#fff',
strokeOpacity: 0.5,
strokeWidth: 1,
}
}
};
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="calendar_basic" style="width: 1000px; height: 350px;"></div>
</body> |