annotate graph.html @ 20:3bb3d9a9f1b7

Filter by keywords and states. Configuration via configuration file. "No prio" grapf is displayed. (./display_issues_demo.py is not yet dynamic, it needs all states)
author Magnus Schieder <mschieder@intevation.de>
date Mon, 22 Oct 2018 16:49:58 +0200
parents f198a92dd37f
children 7161ce4e7ab1
rev   line source
0
3f139db894f1 initial commit
sean
parents:
diff changeset
1 <!DOCTYPE html>
3f139db894f1 initial commit
sean
parents:
diff changeset
2 <html>
3f139db894f1 initial commit
sean
parents:
diff changeset
3 <head>
3f139db894f1 initial commit
sean
parents:
diff changeset
4 <title> Issues </title>
3f139db894f1 initial commit
sean
parents:
diff changeset
5 <style type = text/css>
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
6
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
7 * {
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
8 font-family: "Sans-serif";
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
9 font-size: 14px;
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
10 }
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
11
0
3f139db894f1 initial commit
sean
parents:
diff changeset
12 .svg div{
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
13 font: 10px;
0
3f139db894f1 initial commit
sean
parents:
diff changeset
14 text-align: right;
3f139db894f1 initial commit
sean
parents:
diff changeset
15 float: left;
3f139db894f1 initial commit
sean
parents:
diff changeset
16 display: block;
3f139db894f1 initial commit
sean
parents:
diff changeset
17 padding: 10px;
3f139db894f1 initial commit
sean
parents:
diff changeset
18 margin: 10px;
3f139db894f1 initial commit
sean
parents:
diff changeset
19 color: white;
3f139db894f1 initial commit
sean
parents:
diff changeset
20 }
3f139db894f1 initial commit
sean
parents:
diff changeset
21
3f139db894f1 initial commit
sean
parents:
diff changeset
22 .axis path,
3f139db894f1 initial commit
sean
parents:
diff changeset
23
3f139db894f1 initial commit
sean
parents:
diff changeset
24 .axis line {
3f139db894f1 initial commit
sean
parents:
diff changeset
25 fill: none;
3f139db894f1 initial commit
sean
parents:
diff changeset
26 stroke: black;
3f139db894f1 initial commit
sean
parents:
diff changeset
27 stroke-width: 1px;
3f139db894f1 initial commit
sean
parents:
diff changeset
28 }
3f139db894f1 initial commit
sean
parents:
diff changeset
29
3f139db894f1 initial commit
sean
parents:
diff changeset
30 .line {
3f139db894f1 initial commit
sean
parents:
diff changeset
31 fill: none;
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
32 stroke-width: 3px;
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
33 opacity: 1;
0
3f139db894f1 initial commit
sean
parents:
diff changeset
34 }
3f139db894f1 initial commit
sean
parents:
diff changeset
35
3f139db894f1 initial commit
sean
parents:
diff changeset
36 .line.critical {
3f139db894f1 initial commit
sean
parents:
diff changeset
37 stroke: red;
3f139db894f1 initial commit
sean
parents:
diff changeset
38 }
3f139db894f1 initial commit
sean
parents:
diff changeset
39
3f139db894f1 initial commit
sean
parents:
diff changeset
40 .line.critical.legend {
3f139db894f1 initial commit
sean
parents:
diff changeset
41 fill: red;
3f139db894f1 initial commit
sean
parents:
diff changeset
42 }
3f139db894f1 initial commit
sean
parents:
diff changeset
43
3f139db894f1 initial commit
sean
parents:
diff changeset
44 .line.urgent {
3f139db894f1 initial commit
sean
parents:
diff changeset
45 stroke: orange;
3f139db894f1 initial commit
sean
parents:
diff changeset
46 }
3f139db894f1 initial commit
sean
parents:
diff changeset
47
3f139db894f1 initial commit
sean
parents:
diff changeset
48 .line.urgent.legend {
3f139db894f1 initial commit
sean
parents:
diff changeset
49 fill: orange;
3f139db894f1 initial commit
sean
parents:
diff changeset
50 }
3f139db894f1 initial commit
sean
parents:
diff changeset
51
3f139db894f1 initial commit
sean
parents:
diff changeset
52 .line.bug {
3f139db894f1 initial commit
sean
parents:
diff changeset
53 stroke: violet;
3f139db894f1 initial commit
sean
parents:
diff changeset
54 }
3f139db894f1 initial commit
sean
parents:
diff changeset
55
3f139db894f1 initial commit
sean
parents:
diff changeset
56 .line.bug.legend {
3f139db894f1 initial commit
sean
parents:
diff changeset
57 fill: violet;
3f139db894f1 initial commit
sean
parents:
diff changeset
58 }
3f139db894f1 initial commit
sean
parents:
diff changeset
59
3f139db894f1 initial commit
sean
parents:
diff changeset
60 .line.feature {
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
61 stroke: chartreuse;
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
62 style: stroke-dasharray;
0
3f139db894f1 initial commit
sean
parents:
diff changeset
63 }
3f139db894f1 initial commit
sean
parents:
diff changeset
64
3f139db894f1 initial commit
sean
parents:
diff changeset
65 .line.feature.legend {
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
66 fill: chartreuse;
0
3f139db894f1 initial commit
sean
parents:
diff changeset
67 }
3f139db894f1 initial commit
sean
parents:
diff changeset
68
3f139db894f1 initial commit
sean
parents:
diff changeset
69 .line.wish {
3f139db894f1 initial commit
sean
parents:
diff changeset
70 stroke: blue;
3f139db894f1 initial commit
sean
parents:
diff changeset
71 }
3f139db894f1 initial commit
sean
parents:
diff changeset
72
3f139db894f1 initial commit
sean
parents:
diff changeset
73 .line.wish.legend {
3f139db894f1 initial commit
sean
parents:
diff changeset
74 fill: blue;
3f139db894f1 initial commit
sean
parents:
diff changeset
75 }
3f139db894f1 initial commit
sean
parents:
diff changeset
76
20
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
77 .line.noprio {
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
78 stroke: grey;
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
79 }
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
80
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
81 .line.noprio.legend {
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
82 fill: grey;
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
83 }
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
84
0
3f139db894f1 initial commit
sean
parents:
diff changeset
85 .grid .tick {
3f139db894f1 initial commit
sean
parents:
diff changeset
86 stroke: lightgrey;
3f139db894f1 initial commit
sean
parents:
diff changeset
87 opacity: 0.7;
3f139db894f1 initial commit
sean
parents:
diff changeset
88 }
3f139db894f1 initial commit
sean
parents:
diff changeset
89
3f139db894f1 initial commit
sean
parents:
diff changeset
90 .grid path {
3f139db894f1 initial commit
sean
parents:
diff changeset
91 stroke-width: 0;
3f139db894f1 initial commit
sean
parents:
diff changeset
92 }
3f139db894f1 initial commit
sean
parents:
diff changeset
93
3f139db894f1 initial commit
sean
parents:
diff changeset
94 </style>
3f139db894f1 initial commit
sean
parents:
diff changeset
95 </head>
3f139db894f1 initial commit
sean
parents:
diff changeset
96 <body>
20
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
97 <h1>Filter</h1>
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
98 <p>States: status</p>
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
99 <p>Keywords: keywords</p>
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
100 <div id="content" style="display: inline-block"></div>
0
3f139db894f1 initial commit
sean
parents:
diff changeset
101 <script type="text/javascript" src="d3.v3.min.js"></script>
3f139db894f1 initial commit
sean
parents:
diff changeset
102 <script type="text/javascript">
3f139db894f1 initial commit
sean
parents:
diff changeset
103
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
104 window.onresize = function(){
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
105 document.getElementById("content").innerHTML = "";
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
106 makeChart();
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
107 };
0
3f139db894f1 initial commit
sean
parents:
diff changeset
108
3f139db894f1 initial commit
sean
parents:
diff changeset
109 var critical=[];
3f139db894f1 initial commit
sean
parents:
diff changeset
110 var urgent=[];
3f139db894f1 initial commit
sean
parents:
diff changeset
111 var bug=[];
3f139db894f1 initial commit
sean
parents:
diff changeset
112 var feature=[];
3f139db894f1 initial commit
sean
parents:
diff changeset
113 var wish=[];
20
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
114 var noPrio=[];
0
3f139db894f1 initial commit
sean
parents:
diff changeset
115 var timestamp=[];
3f139db894f1 initial commit
sean
parents:
diff changeset
116
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
117
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
118
0
3f139db894f1 initial commit
sean
parents:
diff changeset
119 function assignIssueToDate(issueArray, dateArray){
3f139db894f1 initial commit
sean
parents:
diff changeset
120 a = [];
3f139db894f1 initial commit
sean
parents:
diff changeset
121 for (var i = 0; i < issueArray.length; i++) {
3f139db894f1 initial commit
sean
parents:
diff changeset
122 a.push({points: issueArray[i].points, date : dateArray[i].date});
3f139db894f1 initial commit
sean
parents:
diff changeset
123 }
3f139db894f1 initial commit
sean
parents:
diff changeset
124
3f139db894f1 initial commit
sean
parents:
diff changeset
125 return a;
3f139db894f1 initial commit
sean
parents:
diff changeset
126 }
3f139db894f1 initial commit
sean
parents:
diff changeset
127
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
128 function limitDatesOnXAxis(limit){
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
129 if ( timestamp.length < limit ){
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
130 return timestamp.length;
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
131 } else {
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
132 return limit;
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
133 }
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
134 }
0
3f139db894f1 initial commit
sean
parents:
diff changeset
135
3f139db894f1 initial commit
sean
parents:
diff changeset
136 function maxInObject( array ){
3f139db894f1 initial commit
sean
parents:
diff changeset
137 var maxVal = 0;
3f139db894f1 initial commit
sean
parents:
diff changeset
138 for (var i = 0; i < array.length; i++) {
3f139db894f1 initial commit
sean
parents:
diff changeset
139 if (maxVal < array[i].points){
3f139db894f1 initial commit
sean
parents:
diff changeset
140 maxVal = array[i].points;
3f139db894f1 initial commit
sean
parents:
diff changeset
141 }
3f139db894f1 initial commit
sean
parents:
diff changeset
142 }
3f139db894f1 initial commit
sean
parents:
diff changeset
143 return maxVal;
3f139db894f1 initial commit
sean
parents:
diff changeset
144 }
3f139db894f1 initial commit
sean
parents:
diff changeset
145
3f139db894f1 initial commit
sean
parents:
diff changeset
146
3f139db894f1 initial commit
sean
parents:
diff changeset
147 function getMaxIssues(){
3f139db894f1 initial commit
sean
parents:
diff changeset
148 maxIssuesOfAllArrays = [];
3f139db894f1 initial commit
sean
parents:
diff changeset
149 maxIssuesOfAllArrays.push(maxInObject(critical));
3f139db894f1 initial commit
sean
parents:
diff changeset
150 maxIssuesOfAllArrays.push(maxInObject(urgent));
3f139db894f1 initial commit
sean
parents:
diff changeset
151 maxIssuesOfAllArrays.push(maxInObject(bug));
3f139db894f1 initial commit
sean
parents:
diff changeset
152 maxIssuesOfAllArrays.push(maxInObject(feature));
3f139db894f1 initial commit
sean
parents:
diff changeset
153 maxIssuesOfAllArrays.push(maxInObject(wish));
20
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
154 maxIssuesOfAllArrays.push(maxInObject(noPrio));
0
3f139db894f1 initial commit
sean
parents:
diff changeset
155
3f139db894f1 initial commit
sean
parents:
diff changeset
156 return Math.max.apply(Math, maxIssuesOfAllArrays)+1;
3f139db894f1 initial commit
sean
parents:
diff changeset
157 }
3f139db894f1 initial commit
sean
parents:
diff changeset
158
3f139db894f1 initial commit
sean
parents:
diff changeset
159
3f139db894f1 initial commit
sean
parents:
diff changeset
160 function dayDifference(first, second) {
3f139db894f1 initial commit
sean
parents:
diff changeset
161 "use strict";
3f139db894f1 initial commit
sean
parents:
diff changeset
162 var difference = (second - first) / (1000 * 60 * 60 * 24);
3f139db894f1 initial commit
sean
parents:
diff changeset
163
3f139db894f1 initial commit
sean
parents:
diff changeset
164 // just to avoid the get thousands of lines... would look ugly.
3f139db894f1 initial commit
sean
parents:
diff changeset
165 if (difference > 60){
3f139db894f1 initial commit
sean
parents:
diff changeset
166 difference = 60;
3f139db894f1 initial commit
sean
parents:
diff changeset
167 }
3f139db894f1 initial commit
sean
parents:
diff changeset
168
3f139db894f1 initial commit
sean
parents:
diff changeset
169 return difference;
3f139db894f1 initial commit
sean
parents:
diff changeset
170 }
3f139db894f1 initial commit
sean
parents:
diff changeset
171
3f139db894f1 initial commit
sean
parents:
diff changeset
172
3f139db894f1 initial commit
sean
parents:
diff changeset
173 // function for the grid lines
3f139db894f1 initial commit
sean
parents:
diff changeset
174 function makeGrid(direction, orientation, ticknumber) {
3f139db894f1 initial commit
sean
parents:
diff changeset
175 return d3.svg.axis()
3f139db894f1 initial commit
sean
parents:
diff changeset
176 .scale(direction)
3f139db894f1 initial commit
sean
parents:
diff changeset
177 .orient(orientation)
3f139db894f1 initial commit
sean
parents:
diff changeset
178 .ticks( ticknumber );
3f139db894f1 initial commit
sean
parents:
diff changeset
179 }
3f139db894f1 initial commit
sean
parents:
diff changeset
180
3f139db894f1 initial commit
sean
parents:
diff changeset
181
3f139db894f1 initial commit
sean
parents:
diff changeset
182 //append a svg_path. pretty generic
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
183 function draw_line(svg, data_array, css_class, line_object, lineShape){
0
3f139db894f1 initial commit
sean
parents:
diff changeset
184 svg.append("path")
3f139db894f1 initial commit
sean
parents:
diff changeset
185 .datum(assignIssueToDate(data_array, timestamp))
3f139db894f1 initial commit
sean
parents:
diff changeset
186 .attr("class", css_class)
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
187 .style("stroke-dasharray", (lineShape))
0
3f139db894f1 initial commit
sean
parents:
diff changeset
188 .attr("d", line_object);
3f139db894f1 initial commit
sean
parents:
diff changeset
189 }
3f139db894f1 initial commit
sean
parents:
diff changeset
190
3f139db894f1 initial commit
sean
parents:
diff changeset
191
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
192 function makeLegend(svg, width){
0
3f139db894f1 initial commit
sean
parents:
diff changeset
193
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
194 var legend_distance = width+40;
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
195 var top_distance = 20;
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
196 var distance_steps = 50;
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
197
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
198
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
199 function set_propper_distance(steps){
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
200 top_distance += steps;
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
201 return top_distance;
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
202 }
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
203
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
204 function draw_legend_line(svg, width, Ypos, text, issues){
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
205 svg.append("svg:text")
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
206 .attr("class", "legend")
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
207 .attr("x", width-30 )
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
208 .attr("y", Ypos)
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
209 .text(text + ":");
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
210
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
211 svg.append("svg:text")
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
212 .attr("class", "legend")
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
213 .attr("x", width+35 )
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
214 .attr("y", Ypos)
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
215 .text(issues);
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
216
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
217 svg.append("rect")
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
218 .attr("class", "line " + text.toLowerCase() + " legend")
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
219 .attr("x", width-30)
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
220 .attr("y", Ypos-20)
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
221 .attr("width", 100)
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
222 .attr("height", 2);
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
223 }
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
224
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
225 draw_legend_line(svg, legend_distance, set_propper_distance(distance_steps), "Critical", critical[critical.length-1].points);
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
226 draw_legend_line(svg, legend_distance, set_propper_distance(distance_steps), "Urgent", urgent[urgent.length-1].points);
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
227 draw_legend_line(svg, legend_distance, set_propper_distance(distance_steps), "Bug", bug[bug.length-1].points);
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
228 draw_legend_line(svg, legend_distance, set_propper_distance(distance_steps), "Feature", feature[feature.length-1].points);
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
229 draw_legend_line(svg, legend_distance, set_propper_distance(distance_steps), "Wish", wish[wish.length-1].points);
20
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
230 draw_legend_line(svg, legend_distance, set_propper_distance(distance_steps), "NoPrio", noPrio[noPrio.length-1].points);
0
3f139db894f1 initial commit
sean
parents:
diff changeset
231 }
3f139db894f1 initial commit
sean
parents:
diff changeset
232
3f139db894f1 initial commit
sean
parents:
diff changeset
233
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
234
0
3f139db894f1 initial commit
sean
parents:
diff changeset
235 //draw the chart
3f139db894f1 initial commit
sean
parents:
diff changeset
236 function makeChart(){
3f139db894f1 initial commit
sean
parents:
diff changeset
237
3f139db894f1 initial commit
sean
parents:
diff changeset
238 //declaration
3f139db894f1 initial commit
sean
parents:
diff changeset
239 var sizeOfSystemBorders = 50;
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
240 var margin = {top: 20, right: 100, bottom: 90, left: 60},
0
3f139db894f1 initial commit
sean
parents:
diff changeset
241 width = (document.documentElement.clientWidth-sizeOfSystemBorders) - margin.left - margin.right,
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
242 height = (document.documentElement.clientHeight-sizeOfSystemBorders) - margin.top - margin.bottom;
0
3f139db894f1 initial commit
sean
parents:
diff changeset
243
3f139db894f1 initial commit
sean
parents:
diff changeset
244 var x = d3.time.scale()
3f139db894f1 initial commit
sean
parents:
diff changeset
245 .range([0, width]);
3f139db894f1 initial commit
sean
parents:
diff changeset
246
3f139db894f1 initial commit
sean
parents:
diff changeset
247 var y = d3.scale.linear()
3f139db894f1 initial commit
sean
parents:
diff changeset
248 .range([height, 0]);
3f139db894f1 initial commit
sean
parents:
diff changeset
249
3f139db894f1 initial commit
sean
parents:
diff changeset
250 var base_line = d3.svg.line()
3f139db894f1 initial commit
sean
parents:
diff changeset
251 .x(function(d) { return x(d.date); })
3f139db894f1 initial commit
sean
parents:
diff changeset
252 .y(function(d) { return y(d.points); });
3f139db894f1 initial commit
sean
parents:
diff changeset
253
3f139db894f1 initial commit
sean
parents:
diff changeset
254 //lines
3f139db894f1 initial commit
sean
parents:
diff changeset
255 var criticalLine = base_line;
3f139db894f1 initial commit
sean
parents:
diff changeset
256 var urgentLine = base_line;
3f139db894f1 initial commit
sean
parents:
diff changeset
257 var bugLine = base_line;
3f139db894f1 initial commit
sean
parents:
diff changeset
258 var featureLine = base_line;
3f139db894f1 initial commit
sean
parents:
diff changeset
259 var wishLine = base_line;
20
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
260 var noPrioLine = base_line;
0
3f139db894f1 initial commit
sean
parents:
diff changeset
261 var timestampLine = base_line;
3f139db894f1 initial commit
sean
parents:
diff changeset
262
3f139db894f1 initial commit
sean
parents:
diff changeset
263
3f139db894f1 initial commit
sean
parents:
diff changeset
264 //set domain of y axis
3f139db894f1 initial commit
sean
parents:
diff changeset
265 var yDomain = [ ];
3f139db894f1 initial commit
sean
parents:
diff changeset
266 yDomain[0] = 0;
3f139db894f1 initial commit
sean
parents:
diff changeset
267 yDomain[1] = getMaxIssues();
3f139db894f1 initial commit
sean
parents:
diff changeset
268 y.domain(d3.extent(yDomain, function(d){return d; }));
3f139db894f1 initial commit
sean
parents:
diff changeset
269
3f139db894f1 initial commit
sean
parents:
diff changeset
270 //set domain of y axis
3f139db894f1 initial commit
sean
parents:
diff changeset
271 x.domain(d3.extent(timestamp, function(d){return d.date; }));
3f139db894f1 initial commit
sean
parents:
diff changeset
272
3f139db894f1 initial commit
sean
parents:
diff changeset
273
3f139db894f1 initial commit
sean
parents:
diff changeset
274 var xAxis = d3.svg.axis()
3f139db894f1 initial commit
sean
parents:
diff changeset
275 .scale(x)
3f139db894f1 initial commit
sean
parents:
diff changeset
276 .orient("bottom")
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
277 .ticks(limitDatesOnXAxis(10))
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
278 .tickFormat(d3.time.format("%d.%m:%H:%M"));
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
279 // .tickFormat(d3.time.format("%X"));
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
280 // .tickFormat(d3.time.format.iso);
0
3f139db894f1 initial commit
sean
parents:
diff changeset
281
3f139db894f1 initial commit
sean
parents:
diff changeset
282
3f139db894f1 initial commit
sean
parents:
diff changeset
283 var yAxis = d3.svg.axis()
3f139db894f1 initial commit
sean
parents:
diff changeset
284 .scale(y)
3f139db894f1 initial commit
sean
parents:
diff changeset
285 .orient("left");
3f139db894f1 initial commit
sean
parents:
diff changeset
286
3f139db894f1 initial commit
sean
parents:
diff changeset
287
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
288 var svg = d3.select("#content")
0
3f139db894f1 initial commit
sean
parents:
diff changeset
289 .append("svg")
3f139db894f1 initial commit
sean
parents:
diff changeset
290 .attr("class", "svg")
3f139db894f1 initial commit
sean
parents:
diff changeset
291 .attr("width", width + margin.left + margin.right)
3f139db894f1 initial commit
sean
parents:
diff changeset
292 .attr("height", height + margin.top + margin.bottom)
3f139db894f1 initial commit
sean
parents:
diff changeset
293 .append("g")
3f139db894f1 initial commit
sean
parents:
diff changeset
294 .attr("transform", "translate(" + margin.left + "," + margin.top + ")");
3f139db894f1 initial commit
sean
parents:
diff changeset
295
3f139db894f1 initial commit
sean
parents:
diff changeset
296
3f139db894f1 initial commit
sean
parents:
diff changeset
297 // creation
3f139db894f1 initial commit
sean
parents:
diff changeset
298
3f139db894f1 initial commit
sean
parents:
diff changeset
299
3f139db894f1 initial commit
sean
parents:
diff changeset
300 // Draw the x Grid lines
11
f198a92dd37f Do not render vertical grid lines
Gernot Schulz <gernot@intevation.de>
parents: 1
diff changeset
301 // svg.append("g")
f198a92dd37f Do not render vertical grid lines
Gernot Schulz <gernot@intevation.de>
parents: 1
diff changeset
302 // .attr("class", "grid")
f198a92dd37f Do not render vertical grid lines
Gernot Schulz <gernot@intevation.de>
parents: 1
diff changeset
303 // .attr("transform", "translate(0," + height + ")")
f198a92dd37f Do not render vertical grid lines
Gernot Schulz <gernot@intevation.de>
parents: 1
diff changeset
304 // .call(makeGrid(x, "bottom", timestamp.length)
f198a92dd37f Do not render vertical grid lines
Gernot Schulz <gernot@intevation.de>
parents: 1
diff changeset
305 // .tickSize(-height, 0, 0)
f198a92dd37f Do not render vertical grid lines
Gernot Schulz <gernot@intevation.de>
parents: 1
diff changeset
306 // .tickFormat("")
f198a92dd37f Do not render vertical grid lines
Gernot Schulz <gernot@intevation.de>
parents: 1
diff changeset
307 // );
0
3f139db894f1 initial commit
sean
parents:
diff changeset
308
3f139db894f1 initial commit
sean
parents:
diff changeset
309
3f139db894f1 initial commit
sean
parents:
diff changeset
310 // Draw the y Grid lines
3f139db894f1 initial commit
sean
parents:
diff changeset
311 svg.append("g")
3f139db894f1 initial commit
sean
parents:
diff changeset
312 .attr("class", "grid")
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
313 .call(makeGrid(y, "left", function(){return Math.min(getMaxIssues(), 50);}())
0
3f139db894f1 initial commit
sean
parents:
diff changeset
314 .tickSize(-width, 0, 0)
3f139db894f1 initial commit
sean
parents:
diff changeset
315 .tickFormat("")
3f139db894f1 initial commit
sean
parents:
diff changeset
316 );
3f139db894f1 initial commit
sean
parents:
diff changeset
317
3f139db894f1 initial commit
sean
parents:
diff changeset
318
3f139db894f1 initial commit
sean
parents:
diff changeset
319 // Draw the x-axis
3f139db894f1 initial commit
sean
parents:
diff changeset
320 svg.append("g")
3f139db894f1 initial commit
sean
parents:
diff changeset
321 .attr("class", "x axis")
3f139db894f1 initial commit
sean
parents:
diff changeset
322 .attr("transform", "translate(0," + height + ")")
3f139db894f1 initial commit
sean
parents:
diff changeset
323 .call(xAxis)
3f139db894f1 initial commit
sean
parents:
diff changeset
324 .selectAll("text")
3f139db894f1 initial commit
sean
parents:
diff changeset
325 .style("text-anchor", "end")
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
326 .attr("dx", "-.5em")
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
327 .attr("dy", ".1em")
0
3f139db894f1 initial commit
sean
parents:
diff changeset
328 .attr("transform", function() {
3f139db894f1 initial commit
sean
parents:
diff changeset
329 return "rotate(-65)";
3f139db894f1 initial commit
sean
parents:
diff changeset
330 });
3f139db894f1 initial commit
sean
parents:
diff changeset
331
3f139db894f1 initial commit
sean
parents:
diff changeset
332
3f139db894f1 initial commit
sean
parents:
diff changeset
333 // Draw the y-axis
3f139db894f1 initial commit
sean
parents:
diff changeset
334 svg.append("g")
3f139db894f1 initial commit
sean
parents:
diff changeset
335 .attr("class", "y axis")
3f139db894f1 initial commit
sean
parents:
diff changeset
336 .call(yAxis)
3f139db894f1 initial commit
sean
parents:
diff changeset
337 .append("text")
3f139db894f1 initial commit
sean
parents:
diff changeset
338 .attr("transform", "rotate(-90)")
3f139db894f1 initial commit
sean
parents:
diff changeset
339 .attr("y", 6)
3f139db894f1 initial commit
sean
parents:
diff changeset
340 .attr("dy", ".71em")
3f139db894f1 initial commit
sean
parents:
diff changeset
341 .style("text-anchor", "end");
3f139db894f1 initial commit
sean
parents:
diff changeset
342
3f139db894f1 initial commit
sean
parents:
diff changeset
343
3f139db894f1 initial commit
sean
parents:
diff changeset
344 // Text for y-axis
3f139db894f1 initial commit
sean
parents:
diff changeset
345 svg.append("text")
3f139db894f1 initial commit
sean
parents:
diff changeset
346 .attr("transform", "rotate(-90)")
3f139db894f1 initial commit
sean
parents:
diff changeset
347 .attr("y", 10 - margin.left)
3f139db894f1 initial commit
sean
parents:
diff changeset
348 .attr("x", 0 - (height / 2))
3f139db894f1 initial commit
sean
parents:
diff changeset
349 .attr("dy", "1em")
3f139db894f1 initial commit
sean
parents:
diff changeset
350 .style("text-anchor", "middle")
3f139db894f1 initial commit
sean
parents:
diff changeset
351 .text("Issues");
3f139db894f1 initial commit
sean
parents:
diff changeset
352
3f139db894f1 initial commit
sean
parents:
diff changeset
353
3f139db894f1 initial commit
sean
parents:
diff changeset
354 //Titel und Legende
3f139db894f1 initial commit
sean
parents:
diff changeset
355
3f139db894f1 initial commit
sean
parents:
diff changeset
356 svg.append("svg:text")
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
357 .attr("class", "text")
0
3f139db894f1 initial commit
sean
parents:
diff changeset
358 .attr("x", 10)
3f139db894f1 initial commit
sean
parents:
diff changeset
359 .attr("y", -5)
3f139db894f1 initial commit
sean
parents:
diff changeset
360 .text("Issues Nach Zeit");
3f139db894f1 initial commit
sean
parents:
diff changeset
361
3f139db894f1 initial commit
sean
parents:
diff changeset
362
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
363 draw_line(svg, wish, "line wish", wishLine, "0, 0");
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
364 draw_line(svg, feature, "line feature", featureLine, "3, 3");
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
365 draw_line(svg, bug, "line bug", bugLine, "7, 7");
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
366 draw_line(svg, urgent, "line urgent", urgentLine, "13, 13");
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
367 draw_line(svg, critical, "line critical", criticalLine, "17, 17");
20
3bb3d9a9f1b7 Filter by keywords and states.
Magnus Schieder <mschieder@intevation.de>
parents: 11
diff changeset
368 draw_line(svg, noPrio, "line noprio", noPrioLine, "17, 17");
0
3f139db894f1 initial commit
sean
parents:
diff changeset
369
3f139db894f1 initial commit
sean
parents:
diff changeset
370
1
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
371 makeLegend(svg, width);
2df45f6ecd81 new appereance (solid and dotted lines), resonsive layout, new legend,
sean
parents: 0
diff changeset
372
0
3f139db894f1 initial commit
sean
parents:
diff changeset
373
3f139db894f1 initial commit
sean
parents:
diff changeset
374 }
3f139db894f1 initial commit
sean
parents:
diff changeset
375
3f139db894f1 initial commit
sean
parents:
diff changeset
376 makeChart();
3f139db894f1 initial commit
sean
parents:
diff changeset
377
3f139db894f1 initial commit
sean
parents:
diff changeset
378
3f139db894f1 initial commit
sean
parents:
diff changeset
379 </script>
3f139db894f1 initial commit
sean
parents:
diff changeset
380 </body>
3f139db894f1 initial commit
sean
parents:
diff changeset
381 </html>
This site is hosted by Intevation GmbH (Datenschutzerklärung und Impressum | Privacy Policy and Imprint)