|
1
|
|
|
function chartMaintainability() { |
|
2
|
|
|
|
|
3
|
|
|
var diameter = document.getElementById('svg-maintainability').offsetWidth; |
|
4
|
|
|
|
|
5
|
|
|
var json = { |
|
6
|
|
|
name: 'chart', |
|
7
|
|
|
children: classes |
|
|
|
|
|
|
8
|
|
|
}; |
|
9
|
|
|
|
|
10
|
|
|
var svg = d3.select('#svg-maintainability').append('svg') |
|
|
|
|
|
|
11
|
|
|
.attr('width', diameter) |
|
12
|
|
|
.attr('height', diameter); |
|
13
|
|
|
|
|
14
|
|
|
|
|
15
|
|
|
var bubble = d3.layout.pack() |
|
16
|
|
|
.size([diameter, diameter]) |
|
17
|
|
|
.padding(3) |
|
18
|
|
|
.value(function (d) { |
|
19
|
|
|
return d.ccn; |
|
20
|
|
|
}); |
|
21
|
|
|
|
|
22
|
|
|
var nodes = bubble.nodes(json) |
|
23
|
|
|
.filter(function (d) { |
|
24
|
|
|
return !d.children; |
|
25
|
|
|
}); // filter out the outer bubble* |
|
26
|
|
|
|
|
27
|
|
|
var vis = svg.selectAll('circle') |
|
28
|
|
|
.data(nodes, function (d) { |
|
29
|
|
|
return d.name; |
|
30
|
|
|
}); |
|
31
|
|
|
|
|
32
|
|
|
vis.enter().append('circle') |
|
33
|
|
|
.attr('transform', function (d) { |
|
34
|
|
|
return 'translate(' + d.x + ',' + d.y + ')'; |
|
35
|
|
|
}) |
|
36
|
|
|
.attr('r', function (d) { |
|
37
|
|
|
return d.r; |
|
38
|
|
|
}) |
|
39
|
|
|
.style("fill", function (d) { |
|
40
|
|
|
if (d.mi > 85) { |
|
41
|
|
|
return '#8BC34A'; |
|
42
|
|
|
} else if (d.mi > 69) { |
|
43
|
|
|
return '#FFC107'; |
|
44
|
|
|
} else { |
|
45
|
|
|
return '#F44336'; |
|
46
|
|
|
} |
|
47
|
|
|
}) |
|
48
|
|
|
.attr("transform", function (d) { |
|
49
|
|
|
return "translate(" + d.x + "," + d.y + ")"; |
|
50
|
|
|
}) |
|
51
|
|
|
.on('mouseover', function (d) { |
|
52
|
|
|
var text = '<strong>' + d.name + '</strong>' |
|
53
|
|
|
+ "<br />Cyclomatic Complexity : " + d.ccn |
|
54
|
|
|
+ "<br />Maintainability Index: " + d.mi; |
|
55
|
|
|
d3.select('.tooltip').html(text); |
|
|
|
|
|
|
56
|
|
|
d3.select(".tooltip").style("opacity", 1); |
|
57
|
|
|
}) |
|
58
|
|
|
.on('mousemove', function () { |
|
59
|
|
|
d3.select(".tooltip") |
|
|
|
|
|
|
60
|
|
|
.style("left", (d3.event.pageX + 5) + "px") |
|
61
|
|
|
.style("top", (d3.event.pageY + 5) + "px"); |
|
62
|
|
|
}) |
|
63
|
|
|
.on('mouseout', function () { |
|
64
|
|
|
d3.select(".tooltip").style("opacity", 0); |
|
|
|
|
|
|
65
|
|
|
}); |
|
66
|
|
|
|
|
67
|
|
|
d3.select("body") |
|
68
|
|
|
.append("div") |
|
69
|
|
|
.attr("class", "tooltip") |
|
70
|
|
|
.style("opacity", 0); |
|
71
|
|
|
|
|
72
|
|
|
} |
sergisergio /
Ads
Loading history...
This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.
To learn more about declaring variables in Javascript, see the MDN.