bugdaystats/templates/project-daily.html
Masayuki Igawa f10ee2d6bd Introduce daily bug stats chart
This commit introduces daily bug stats graphs. To do this, this commit
also introduces nvd3 js library for enabling to use lineWithFocusChart.
It is not same style chart of the main pages ones. Because
stackedAreaWithFocusChart is a little bit buggy. So it sometimes shows
wrong charts. And I also think lineWithFocusChart is better than the
stackedArea chart because it is simple enough to understand the trend.

Change-Id: Iacf22cddbd676d1447cfd9ae8ba1e7ce387720f6
2021-07-26 14:06:14 -05:00

53 lines
1.4 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf8" http-equiv="Content-Type"/>
<title>
{{ project.project|capitalize }} Bug Trend
</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.2/d3.min.js" charset="utf-8">
</script>
<script language="javascript" src="js/nv.d3.min.js"></script>
<link href="js/nv.d3.min.css" rel="stylesheet" type="text/css">
<style>
html, body, #chart, svg {
margin: 0px;
padding: 0px;
height: 100%;
width: 100%;
}
</style>
</head>
<body>
<div id="{{ project.project }}" style="width:100%;height:100%;">
<svg></svg>
</div>
<script language="javascript" src="js/package-triaging-daily.js"></script>
<script type="text/javascript">
var testdata;
d3.json("{{ project.project }}-bug-stats-daily.json", function(error, dataSet){
if(error) return console.warn(error);
nv.addGraph(function() {
var chart = nv.models.lineWithFocusChart();
chart.xAxis.tickFormat(function(d) { return d3.time.format('%m/%d')(new Date(d)); });
chart.x2Axis.tickFormat(function(d) { return d3.time.format('%m/%d')(new Date(d)); });
chart.forceY([0]);
d3.select("#{{ project.project }} svg")
.datum(convData(dataSet))
.call(chart);
nv.utils.windowResize(chart.update);
return chart;
});
});
</script>
</body>
</html>