OXIESEC PANEL
- Current Dir:
/
/
home
/
cubot
/
docroot
/
showcase
/
js
/
D3
/
plugins
Server IP: 139.59.38.164
Upload:
Create Dir:
Name
Size
Modified
Perms
📁
..
-
08/14/2022 11:05:22 AM
rwxr-xr-x
📄
Radar.js
8.86 KB
08/14/2022 11:05:21 AM
rw-r--r--
📄
bar.js
17.59 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
bullet.css
422 bytes
08/14/2022 11:05:19 AM
rw-r--r--
📄
bullet.js
10.65 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
calendar.js
16.63 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
calender.css
541 bytes
08/14/2022 11:05:20 AM
rw-r--r--
📄
combo.js
16.74 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
combo_2.js
17.91 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
combo_wip.js
16.61 KB
08/14/2022 11:05:18 AM
rw-r--r--
📄
commonFunc.js
25.28 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
customChart.js
577 bytes
08/14/2022 11:05:20 AM
rw-r--r--
📄
d3Charts.css
2.88 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
donut.js
5.67 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
filledAreaPercent.js
17.95 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
funnel.js
6.03 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
funnel.js_previous_o4aug17
5.86 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
gauged.js
15.3 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
groupbar.js
13.18 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
groupbar_23Aug2019.js
10.85 KB
08/14/2022 11:05:18 AM
rw-r--r--
📄
heatmap.js
9.77 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
html2canvas.min.js
161.47 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
makeJson.js
1.64 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
makeJsonmulti.js
3.75 KB
08/14/2022 11:05:18 AM
rw-r--r--
📄
multiLine.js
17.24 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
multipleDonut.js
5.29 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
pie.js
4.52 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
radar.js
6.49 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
saveSvgAsPng.js
14.62 KB
08/14/2022 11:05:21 AM
rw-r--r--
📄
stackedAreaDate.js
17.56 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
stackedAreaDate_bkup23Nov2020.js
17.56 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
stackedbar.js
10.72 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
stackedbar_bkup21Apr2020.js
10.72 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
stock.js
13.6 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
sun.js
7.59 KB
08/14/2022 11:05:20 AM
rw-r--r--
📄
sunburst.js
7.13 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
tableChart.js
11.54 KB
08/14/2022 11:05:21 AM
rw-r--r--
📄
tableChart_07Jan2020.js
6.7 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
tree.js
7.34 KB
08/14/2022 11:05:19 AM
rw-r--r--
📄
waterfall.js
9.17 KB
08/14/2022 11:05:21 AM
rw-r--r--
📄
zoomTree.js
7.59 KB
08/14/2022 11:05:19 AM
rw-r--r--
Editing: multipleDonut.js
Close
function drawMultipleDonutChart(data, divId, Title, Width, Height, Ndim, Nmeas,measNum, MeasFormats,dispObj,toolTip){ var width = Width-25, height = Height-25, //height = Height, radius = Math.min(width, height) / 2; var r = Math.ceil(Math.sqrt(Nmeas)); var color = d3.scale.ordinal() //.range(dispObj.colorArr); .range(["#98abc5", "#8a89a6", "#7b6888", "#6b486b", "#a05d56", "#d0743c", "#ff8c00"]); d3.select("#"+divId).html('<div class="myChart"><div class="svgLegend"></div><div class="tipsy"></div></div>'); d3.selectAll(".tipsy").style("display", "none"); /*var svg = d3.select("#"+divId).select(".myChart") .append("svg") .attr("width", width) .attr("height", height) .append("g") .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")"); */ var svg1 = new Array(); for(i=0;i<Nmeas;i++) /* svg1[i] = d3.select("#"+divId).select(".myChart") .append("svg") .attr("width", radius*4/Nmeas)//radius*2/n .attr("height", radius*4/Nmeas) .append("g") .attr("transform", "translate(" + radius*2/Nmeas + "," + radius*2/Nmeas + ")"); */ svg1[i] = d3.select("#"+divId).select(".myChart") .append("svg") .attr("width", width/r) .attr("height", width/r) .append("g") .attr("transform", "translate(" + width/(2*r) + "," + width/(2*r) + ")"); var json=makeJsonFromArrayNew(data, Ndim, Nmeas, MeasFormats[0], dispObj); makeParentsJson(json,measNum); plotMultipleDonutChart(divId, svg1, radius, json, measNum, Nmeas, json); } function plotMultipleDonutChart(divId, svg1, radius, curNode, measNum, n, json){ var x = d3.scale.linear() .range([0, 2 * Math.PI]); var y = d3.scale.pow().exponent(1.3).domain([0, 1]).range([0, radius]); var arc = new Array(n); var path = new Array(n); var text = new Array(n); var i = 0; var pie = new Array(n); var g = new Array(n); var partition = new Array(n); var legend = new Array(n); var r = Math.ceil(Math.sqrt(n)); for(i=0;i<n;i++){ pie[i] = d3.layout.pie() .sort(null) .value(function(d) { return +d.size[i]; }); legend[i] = svg1[i].append("text") .attr("text-anchor","middle") .attr("dy", ".50em") .text(function(d) { return json.measName[i]; }); /*arc[i] = d3.svg.arc() .outerRadius(radius*2/n - 15) .innerRadius(30); */ arc[i] = d3.svg.arc() .outerRadius((radius/r)- 10) .innerRadius(30); g[i] = svg1[i].selectAll(".arc") .data(pie[i](curNode.children)) .enter().append("g") .attr("class", "arc"+i); path[i] = g[i].append("path") .attr("d", arc[i]) .attr("id",i) .style("fill","white") .on("click", function(d,i){ //clickMultipleDonut(divId, d, svg1, radius, measNum, n, json)}) clickMultipleDonut(divId, d, i, svg1, 0,0,radius,radius,json,measNum, n, 0)}) .on("mouseover", function(d,i){//showToolTipmd(divId, d.data, n, this); showToolTips(divId, d.data, +this.id+1)}) .on("mouseout", function(d,i){hideToolTip(divId, d,i)}) .transition().delay(function (d,i){ return i * 300;}) .duration(300) .style("fill", function(d, i) { return dispObj.colorArr[i]; }); text[i] = g[i].append("text") .attr("dy", ".35em") .style("text-anchor", "middle") .style("visibility",function(d){ return d.data.name.length < (radius*2/n - 45)/6 ? (d.endAngle - d.startAngle ) < 0.1 ? "hidden" :"visible" : d.data.name.length > (d.endAngle - d.startAngle )*radius*4/(n*20)? "hidden" : "visible" ; } ) .transition().delay(function (d,i){ return i * 300;}) .duration(300) .attr("transform", function(d) { return "translate(" + arc[i].centroid(d) + ")rotate(" + angle(d) + ")"; }) .text(function(d,i) { return d.data.name; }); } function angle(d) { var a = (d.startAngle + d.endAngle) * 90 / Math.PI - 90; //return a > 90 ? a - 180 : a; return d.data.name.length < (d.endAngle - d.startAngle )*radius*4/(n*20) ? ((a>0)&&(a<180)? a-90 : a+ 90) : (a > 90 ? a - 180 : a); } updateLegendll(divId, svg1, curNode, 0,0,radius,radius,json,measNum,n,clickMultipleDonut); } var curLogic="next"; function clickMultipleDonut(divId, d, i, svg1, x,y,radius,radius,json,measNum, n,c){ var curNode; for( var i = 0;i < n;i++){ svg1[i].selectAll(".arc").remove(); svg1[i].selectAll("path").remove(); svg1[i].selectAll("g").remove(); svg1[i].selectAll("text").remove(); } if( c==1 || (curLogic=="next" && (d.children || d.data.children))){ curLogic="next"; curNode=(d.data)?d.data : d; } else { curLogic="previous"; curNode=d.data ? d.data.parent.parent : d; if(typeof curNode == "undefined"){ curLogic="next"; curNode=d.data; } } plotMultipleDonutChart(divId, svg1, radius, curNode, measNum, n, json); } function showToolTipmd(divId, d, n, ele){ var p = d3.select("#"+divId).select(".myChart").select(".tipsy"); p.html(d3.select(ele).attr(".text")); p.html("<div class=\"tipsy-inner\">"+dispIfParent(d)+"</div>"); function disp(d){ return d.dimName + " : " + d.name + "<br>" + this.measNum + " : " + d.size[n-1] + " ( "+ d.percent[n-1] + " ) "+"<br>"; } function dispIfParent (d){ return d.depth===0 ? " " : d.parent ? dispIfParent(d.parent)+disp(d) : " "; } p.style("display", "block").style("visibility", "visible").style("left", d3.event.pageX+"px").style("top", d3.event.pageY+"px"); }