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: sunburst.js
Close
function drawSunburst(data, divId, Title, Width, Height, Ndim, Nmeas, MeasFormats,dispObj,toolTip){ var width = Width, height = Height-25, radius = Math.min(width, height) / 2; 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 color = d3.scale.ordinal().range(dispObj.colorArr); d3.select("#"+divId).html('<div class="myChart"><div class="svgLegend"></div><div class="tipsy"><div class="tipsy-arrow"></div><div class="tipsy-inner"></div></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 partition = d3.layout.partition() .value(function(d) { return d.size; }); var arc = d3.svg.arc() .startAngle(function(d) { return Math.max(0, Math.min(2 * Math.PI, x(d.x))); }) .endAngle(function(d) { return Math.max(0, Math.min(2 * Math.PI, x(d.x + d.dx))); }) .innerRadius(function(d) { return Math.max(0, y(d.y)); }) .outerRadius(function(d) { return Math.max(0, y(d.y + d.dy)); }); var json=makeJsonFromArray(data, Ndim, Nmeas, MeasFormats[0], dispObj); var path = svg.selectAll("path") .data(partition.nodes(json)) .enter().append("path") .attr("d", arc) //.style("fill", function(d,i) { return dispObj.colorArr[i%20]; }) .style("fill", function(d) { return color((d.children ? d : d.parent).name); }) .on("click", function(d){click(divId, d)}) .on("mouseover", function(d,i){showToolTip(divId, d,i)}) .on("mouseout", function(d,i){hideToolTip(divId, d,i)}); var text = svg.selectAll("text") .data(partition.nodes(json)) var textEnter = text.enter().append("text") .attr("text-anchor", "middle") .attr("dy", ".2em") .attr("transform", function(d) { var multiline = (d.name || "").split(" ").length > 1, angle = x(d.x + d.dx / 2) * 180 / Math.PI - 90, rotate = angle + (multiline ? -.5 : 0); return textPos(d,rotate,angle) }) /* .style("visibility",function(d){ //return d.name.length < d.size*radius*d.depth/100 ? "visible" : d.name.length > (Math.max(0, y(d.y + d.dy))- Math.max(0, y(d.y)))/6 ? "hidden" : "visible" ; if(d.name.length < d.size*radius*d.depth/100){ return "visible" ; } else if(d.name.length > (Math.max(0, y(d.y + d.dy))- Math.max(0, y(d.y)))/6 ){ return "hidden"; } else{ return "visible" ; } }) */ .style("visibility",function(d){ return d.name.length < (Math.max(0, Math.min(2 * Math.PI, x(d.x + d.dx)))-Math.max(0, Math.min(2 * Math.PI, x(d.x))))*(radius*d.depth/24) ? "visible" : d.name.length > (Math.max(0, y(d.y + d.dy))- Math.max(0, y(d.y)))/6 ? "hidden" : (Math.max(0, Math.min(2 * Math.PI, x(d.x + d.dx)))-Math.max(0, Math.min(2 * Math.PI, x(d.x)))) < 0.05 ? "hidden" : "visible" ; } ) .text(function(d) { return d.name;}) .on("click", function(d){click(divId, d)}) .on("mouseover", function(d,i){showToolTip(divId, d,i)}) .on("mouseout", function(d,i){hideToolTip(divId, d,i)}); function click(divId, d) { path.transition() .duration(750) .attrTween("d", arcTween(d)); text//.style("visibility", function(e) { //return isParentOf(d, e) ? null : d3.select(this).style("visibility"); //}) .transition() .duration(750) .attrTween("text-anchor", function(d){ return function() { return "middle";} }) .attrTween("transform", function(d) { var multiline = (d.name || "").split(" ").length > 1; return function() { var angle = x(d.x + d.dx / 2) * 180 / Math.PI - 90, rotate = angle + (multiline ? -.5 : 0); return textPos(d,rotate,angle) }; }) .style("fill-opacity", function(e) { return isParentOf(d, e) ? 1 : 1e-6; }) .each("end", function(e) { /* d3.select(this).style("visibility", isParentOf(d, e) ? e.name.length < e.size*radius*e.depth/100 ? "visible" : e.name.length > (Math.max(0, y(e.y + e.dy))- Math.max(0, y(e.y)))/6 ? "hidden" : "visible" : "hidden"); */ d3.select(this).style("visibility", isParentOf(d, e) ? e.name.length < (Math.max(0, Math.min(2 * Math.PI, x(e.x + e.dx)))-Math.max(0, Math.min(2 * Math.PI, x(e.x))))*(radius*e.depth/24) ? "visible" : e.name.length > (Math.max(0, y(e.y + e.dy))- Math.max(0, y(e.y)))/6 ? "hidden" : (Math.max(0, Math.min(2 * Math.PI, x(e.x + e.dx)))-Math.max(0, Math.min(2 * Math.PI, x(e.x)))) < 0.05 ? "hidden" : "visible" : "hidden"); }); updateLegend(divId, d); } function textPos (d,rotate,angle){ /* return d.name.length < d.size*radius*d.depth/100 ? "rotate(" + rotate + ")translate(" + ( y(d.y + d.dy / 2)) + ")rotate(" + (angle > 90 ? (angle > 135 ? 90 : -90) : (angle < 0 ? 90 : -90))+")" : "rotate(" + rotate + ")translate(" + (y(d.y+d.dy / 2)) + ")rotate(" + (angle > 90 ? -180 : 0) + ")"; */ return d.name.length < (Math.max(0, Math.min(2 * Math.PI, x(d.x + d.dx)))-Math.max(0, Math.min(2 * Math.PI, x(d.x))))*(radius*d.depth/24) ? "rotate(" + rotate + ")translate(" + ( y(d.y + d.dy / 2)) + ")rotate(" + (angle > 90 ? (angle > 135 ? 90 : -90) : (angle < 0 ? 90 : -90))+")" : "rotate(" + rotate + ")translate(" + (y(d.y+d.dy / 2)) + ")rotate(" + (angle > 90 ? -180 : 0) + ")"; } function isParentOf(p, c) { if (p === c) return true; if (p.children) { return p.children.some(function(d) { return isParentOf(d, c); }); } return false; } function arcTween(d) { var xd = d3.interpolate(x.domain(), [d.x,d.x + d.dx]), yd = d3.interpolate(y.domain(), [d.y, 1]), yr = d3.interpolate(y.range(), [d.y ? 20 : 0, radius]); return function(d, i) { return i ? function(t) { return arc(d); } : function(t) { x.domain(xd(t)); y.domain(yd(t)).range(yr(t)); return arc(d); }; }; } } function updateLegend(divId, d){ var p = d3.select("#"+divId).select(".myChart").select(".svgLegend"); p.html(dispIfParent(d)); function dispIfParent (d){ return d.depth!==0 ? d.parent ? dispIfParent(d.parent)+(d.depth != 1 ?">":"")+d.name+" ( "+d.percent+" ) " :" ": " "; } } function returnChain(d){ var dChain=new Array(); } function showToolTip(divId, d, i){ var p = d3.select("#"+divId).select(".myChart").select(".tipsy"); var toolTipStr=dispIfParent(d); if(toolTipStr.length>0){ p.html("<div class=\"tipsy-inner\">"+dispIfParent(d)+"</div>"); p.style("display", "block").style("visibility", "visible").style("left", d3.event.pageX+"px").style("top", d3.event.pageY+"px"); } function disp(d){ //return "<div class=\"tipsy-inner\">"+d.dimName+" : "+d.name+"<br>"+d.measName+" : "+formatData(d.size, d.measFormat, 0)+" ( "+d.percent+" ) </div>"; return d.dimName+" : "+d.name+"<br>"+d.measName+" : "+formatData(d.size, d.measFormat, 0)+" ( "+d.percent+" )<br> "; } function dispIfParent (d){ return d.depth===0 ? "" : d.parent ? dispIfParent(d.parent)+disp(d) : " "; /*var tStr=""; for(var i=0; i<d.depth; i++) tStr+=" "; tStr+=d.depth===0 ? " " : d.parent ? dispIfParent(d.parent)+disp(d) : " "; return tStr;*/ } } function hideToolTip(divId, d,i){ var p = d3.select("#"+divId).select(".myChart").select(".tipsy").style("display", "none"); }