55<?php
66include_once "navi.php " ;
77?>
8+ <script src="assets/js/scutter.js"></script>
89
910<?php
1011include_once "data.php " ;
1112include_once "functions.php " ;
1213
14+ $ aggregated = ($ _GET ['aggregated ' ] ?? false ) == "true " ? "true " : false ;
15+
1316
1417function getJson ($ dimensions )
1518{
@@ -21,7 +24,7 @@ function getJson($dimensions)
2124 foreach ($ element as $ activityName => $ content ) {
2225 $ values [] = array (
2326 "series " => 0 ,
24- "shape " => $ shapes [$ shape ],
27+ "shape " => $ shapes [$ shape ] ?? " square " ,
2528 "size " => 3000 ,
2629 "x " => getDifficultyOfImplementation ($ dimensions , $ content ),
2730 "y " => $ content ["usefulness " ],
@@ -38,93 +41,6 @@ function getJson($dimensions)
3841}
3942?>
4043<script>
41- var _d3;
42- nv.addGraph(function () {
43- var init = true;
44-
45- var chart = nv.models.scatterChart()
46- .showDistX(true) //showDist, when true, will display those little distribution lines on the axis.
47- .showDistY(true)
48- .transitionDuration(350)
49- .color(d3.scale.category10().range());
50-
51- var getGraph = false;
52- function getGraphtPt(graph, x1, y1) {
53- var a = graph.series.values;
54- var i = a.length;
55-
56- while (i--) {
57- console.log("ax,ay,x1,y1", a[i].x,a[i].y, x1,y1);
58- if (a[i].x == x1 & a[i].y == y1) {
59- return a[i];
60- }
61- }
62- return null;
63- }
64-
65- chart.tooltipContent(function (key, x, y, graph) {
66- var s = "unknown";
67- var pt = getGraphtPt(graph, x, y);
68- if (pt != null) {
69- s = pt.key;
70- }
71- return '<h3>' + key + ": " + s + '</h3>';
72- });
73-
74- function getLabelForAxis(d) {
75- if(!init) {
76- return d;
77- }
78- if (d <= 1.5) {
79- return "Sehr gering";
80- }
81- if (d <= 2.5) {
82- return "Gering";
83- }
84- if (d <= 3.5) {
85- return "Mittel";
86- }
87- if (d <= 4.5) {
88- return "Hoch"
89- }
90- if (d <= 5) {
91- return "Sehr Hoch";
92- }
93- return "";
94- }
95-
96- //Axis settings
97- chart.xAxis
98- .tickFormat(function (d) {
99- return getLabelForAxis(d);
100- })
101- .axisLabel("Difficulty of Implementation");
102- chart.yAxis
103- .tickFormat(function (d) {
104- return getLabelForAxis(d);
105- })
106- .axisLabel("Value");
107-
108- chart.scatter.forceX([1, 6]);
109- chart.scatter.forceY([1, 6]);
110-
111- //We want to show shapes other than circles.
112- chart.scatter.onlyCircles(false);
113-
114- var myData = getData();
115- var svg = d3.select('#chart svg')
116- svg.datum(myData)
117- svg.call(chart);
118- //svg. call(chart);
119- nv.utils.windowResize(chart.update);
120- toggle();
121- $("#toggleChartLabel").click(function () {
122- toggle();
123- });
124- init = false;
125- return chart;
126- });
127-
12844 /**************************************
12945 * Simple test data generator
13046 */
@@ -134,48 +50,17 @@ function getData() { //# groups,# points per group
13450 data = <?php echo getJson ($ dimensions ); ?> ;
13551 return data;
13652 }
137-
138- function toggle() {
139- if ($("text.labels").size() > 0) {
140- $("text.labels").remove();
141- } else {
142- d3.selectAll(".nv-group path")[0].forEach(function (d) {
143- var tf = d3.select(d).attr("transform")
144- t = d3.transform(tf).translate;
145-
146- t[0] = t[0] + 10;//moving the translate x by 5 pixel.
147- //console.log(d3.select(d).style("visibility"))//data associated with the point
148- var point = d3.select(d).data()[0];
149- d3.select(d.parentNode)
150- .append("text")
151- .attr("class", "labels")
152- .text(point.key)//putting data
153- .attr("transform", "translate(" + t[0] + "," + t[1] + ")");//setting the changed translate for label
154- });
155- }
156- }
157-
15853</script>
15954<button id="toggleChartLabel">Toggle Label</button>
16055
16156<form action="?" method="get">
162- <input name="aggregated" type="hidden"
16357<?php
164- if ($ _GET ['aggregated ' ] == "true " ) {
165- echo "value='false' " ;
166- }else {
167- echo "value='true' " ;
168- }
169- ?> ">
58+ echo "<input name= \"aggregated \" type= \"hidden \" value= \"$ aggregated \" /> " ;
59+ ?>
17060
171- </input>
17261 <button id="">
17362 <?php
174- if ($ _GET ['aggregated ' ] == "true " ) {
175- echo "Show specific values " ;
176- }else {
177- echo "Show total values " ;
178- }
63+ echo ($ aggregated == "true " ) ? "Show specific values " : "Show total values " ;
17964 ?>
18065 </button>
18166</form>
0 commit comments