From d1dee9039398cc1de9a67bb23e59d0d377eb74d9 Mon Sep 17 00:00:00 2001 From: mikhail samoilov Date: Sun, 26 Jan 2014 12:58:39 +0200 Subject: [PATCH 01/31] Update tooltip position on mouse move --- c3.js | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) diff --git a/c3.js b/c3.js index 6a93d21..e459119 100644 --- a/c3.js +++ b/c3.js @@ -1120,12 +1120,6 @@ .data([selectedData[0]]) .attr(__axis_rotated ? 'y1' : 'x1', xx) .attr(__axis_rotated ? 'y2' : 'x2', xx); - - // Set tooltip - tooltip.style("top", (d3.mouse(this)[1] + 30) + "px") - .style("left", ((__axis_rotated ? d3.mouse(this)[0] : x(selectedData[0].x)) + 60) + "px"); - tooltip.html(__tooltip_contents(selectedData)); - tooltip.style("visibility", "visible"); }) .on('mouseout', function (d, i) { main.select('line.xgrid-focus').style("visibility", "hidden"); @@ -1140,6 +1134,16 @@ .classed(EXPANDED, false); }) .on('mousemove', function (d, i) { + var selectedData = c3.data.targets.map(function (d) { + return addName(d.values[i]); + }); + + // Set tooltip + tooltip.style("top", (d3.mouse(this)[1] + 15) + "px") + .style("left", ((__axis_rotated ? d3.mouse(this)[0] : x(selectedData[0].x)) + 60) + "px"); + tooltip.html(__tooltip_contents(selectedData)); + tooltip.style("visibility", "visible"); + if (! __data_selection_enabled || dragging) { return; } if (__data_selection_grouped) { return; } // nothing to do when grouped From ad36ed3dabf20439e2d3d9b35aa691ef8c435cbe Mon Sep 17 00:00:00 2001 From: mikhail samoilov Date: Sun, 26 Jan 2014 16:08:42 +0200 Subject: [PATCH 02/31] Use 'display' property to control tooltip visibility --- c3.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/c3.js b/c3.js index e459119..e3d46f9 100644 --- a/c3.js +++ b/c3.js @@ -978,7 +978,7 @@ .style("position", "absolute") .style("width", "30%") // TODO: cul actual width when show .style("z-index", "10") - .style("visibility", "hidden"); + .style("display", "none"); /*-- Main Region --*/ @@ -1123,7 +1123,7 @@ }) .on('mouseout', function (d, i) { main.select('line.xgrid-focus').style("visibility", "hidden"); - tooltip.style("visibility", "hidden"); + tooltip.style("display", "none"); // Undo expanded circles main.selectAll('.-circle-' + i) .filter(function () { return d3.select(this).classed(EXPANDED); }) @@ -1142,7 +1142,7 @@ tooltip.style("top", (d3.mouse(this)[1] + 15) + "px") .style("left", ((__axis_rotated ? d3.mouse(this)[0] : x(selectedData[0].x)) + 60) + "px"); tooltip.html(__tooltip_contents(selectedData)); - tooltip.style("visibility", "visible"); + tooltip.style("display", "block"); if (! __data_selection_enabled || dragging) { return; } if (__data_selection_grouped) { return; } // nothing to do when grouped @@ -1347,7 +1347,7 @@ }))); tooltip.style("top", __tooltip_init_position.top) .style("left", __tooltip_init_position.left) - .style("visibility", "visible"); + .style("display", "block"); } } @@ -1388,7 +1388,7 @@ subY2.domain(y2.domain()); // tooltip - tooltip.style("visibility", "hidden"); + tooltip.style("display", "none"); // grid main.select('line.xgrid-focus') From 135ee5aa27338ce6e9392d1d18fa765dd0e28c1c Mon Sep 17 00:00:00 2001 From: mikhail samoilov Date: Sun, 26 Jan 2014 16:56:15 +0200 Subject: [PATCH 03/31] Dynamic tooltip position based on chart boundaries --- c3.js | 21 ++++++++++++++++----- 1 file changed, 16 insertions(+), 5 deletions(-) diff --git a/c3.js b/c3.js index e3d46f9..10ea75f 100644 --- a/c3.js +++ b/c3.js @@ -976,7 +976,6 @@ .style("position", "relative") .append("div") .style("position", "absolute") - .style("width", "30%") // TODO: cul actual width when show .style("z-index", "10") .style("display", "none"); @@ -1138,11 +1137,23 @@ return addName(d.values[i]); }); + // Construct tooltip + tooltip.html(__tooltip_contents(selectedData)) + .style("visibility", "hidden") + .style("display", "block"); + // Get tooltip dimensions + var tWidth = tooltip.property('offsetWidth'), + tHeight = tooltip.property('offsetHeight'); // Set tooltip - tooltip.style("top", (d3.mouse(this)[1] + 15) + "px") - .style("left", ((__axis_rotated ? d3.mouse(this)[0] : x(selectedData[0].x)) + 60) + "px"); - tooltip.html(__tooltip_contents(selectedData)); - tooltip.style("display", "block"); + // todo get rid of magic numbers + tooltip + .style("top", (d3.mouse(this)[1] + 15 + tHeight < getCurrentHeight() ? d3.mouse(this)[1] + 15 : d3.mouse(this)[1] - tHeight ) + "px") + .style("left", ((__axis_rotated ? + d3.mouse(this)[0] : + (x(selectedData[0].x) + 60 + tWidth < getCurrentWidth()) ? + (x(selectedData[0].x) + 60) +"px" : (x(selectedData[0].x) - tWidth + 30) + "px" + ))) + .style("visibility", "visible"); if (! __data_selection_enabled || dragging) { return; } if (__data_selection_grouped) { return; } // nothing to do when grouped From bb46977011b5066582b0fa7cad74f1a2452fb057 Mon Sep 17 00:00:00 2001 From: Masayuki Tanaka Date: Mon, 27 Jan 2014 16:04:34 +0900 Subject: [PATCH 04/31] Fix load with custom x - #7 --- c3.js | 13 ++++-- c3.min.js | 132 +++++++++++++++++++++++++++--------------------------- 2 files changed, 75 insertions(+), 70 deletions(-) diff --git a/c3.js b/c3.js index 6a93d21..4116653 100644 --- a/c3.js +++ b/c3.js @@ -465,7 +465,6 @@ } return new_rows; } - function convertColumnsToData(columns) { var new_rows = [], i, j, key; for (i = 0; i < columns.length; i++) { @@ -481,7 +480,7 @@ } function convertDataToTargets(data) { var ids = d3.keys(data[0]).filter(function (key) { return key !== __data_x; }); - var targets, i = 0, parsedDate; + var targets, index, parsedDate; // check __data_x is defined if timeseries if (isTimeSeries && ! __data_x) { @@ -489,6 +488,11 @@ return []; } + if (isCustomX && isUndefined(c3.data.x)) { + c3.data.x = data.map(function (d) { return d[__data_x]; }); + } + + index = 0; data.forEach(function (d) { if (isTimeSeries) { if (!(__data_x in d)) { throw Error("'" + __data_x + "' must be included in data"); } @@ -497,13 +501,14 @@ d.x = parsedDate; } else if (isCustomX) { - d.x = d[__data_x]; + d.x = isDefined(d[__data_x]) ? d[__data_x] : c3.data.x[index]; } else { - d.x = i++; + d.x = index; } if (firstDate === null) { firstDate = new Date(d.x); } lastDate = new Date(d.x); + index++; }); targets = ids.map(function (id) { diff --git a/c3.min.js b/c3.min.js index 1b53a45..b475199 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,67 +1,67 @@ -(function(ga){function wc(){function p(e,c){e.attr("transform",function(e){return"translate("+(c(e)+V)+", 0)"})}function s(e,c){e.attr("transform",function(e){return"translate(0,"+c(e)+")"})}function ga(e){var c=e[0];e=e[e.length-1];return ca?0:a}function Cb(a){var b=Ha[a.id];a.name=p(b)?b:a.id;return a}function Tb(a){var b=a[0],d={},h=[],m,e;for(m=1;mv[d].indexOf(e.id)))for(h=0;h=g;g+=t)r+=e(a[c-1],a[c],g,u)}return r}function rb(a){var b=k.data.targets=Ia(a),d,c;lc=e.select(ua);if(lc.empty())ga.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{Q();zb();l.domain(e.extent(a.map(function(a){return a.x})));y.domain(ia("y"));R.domain(ia("y2")); -Y.domain(l.domain());Ua.domain(y.domain());Va.domain(R.domain());J.ticks(10>a.length?a.length:10);la.ticks(Vc).outerTickSize(0).tickFormat(Wc);Wa.ticks(Xc).outerTickSize(0).tickFormat(Yc);S=l.domain();F.x(Y);oa&&G.x(l);La=e.select(ua).append("svg").attr("width",q+B+A).attr("height",t+w+X).on("mouseenter",Zc).on("mouseleave",$c);ab=La.append("defs");ab.append("clipPath").attr("id",sb).append("rect").attr("y",w).attr("width",q).attr("height",t-w);ab.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x", --1-B).attr("y",-20).attr("width",V).attr("height",W);ab.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-B+1).attr("y",w-1).attr("width",ha).attr("height",eb);g=La.append("g").attr("transform",K.main);x=xa?La.append("g").attr("transform",K.context):null;ya=za?La.append("g").attr("transform",K.legend):null;ca=e.select(ua).style("position","relative").append("div").style("position","absolute").style("width","30%").style("z-index","10").style("visibility","hidden");g.append("g").attr("class", -"x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?la:J).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(ad);g.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?J:la).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(bd);Jb&&g.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Wa);d=g.append("g").attr("clip-path", -Ma).attr("class","grid");mc&&d.append("g").attr("class","xgrids");tb&&(c=d.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(tb).enter().append("g").attr("class","xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx",f?0:-w).attr("dy",-6).text(function(a){return a.text}));cd&&d.append("g").attr("class","xgrid-focus").append("line").attr("class", -"xgrid-focus").attr("x1",f?0:-10).attr("x2",f?q:-10).attr("y1",f?-10:w).attr("y2",f?-10:t);nc&&d.append("g").attr("class","ygrids");ub&&d.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(ub).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});g.append("g").attr("clip-path",Ma).attr("class","regions");g.append("g").attr("clip-path",Ma).attr("class","chart");g.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor", -oa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",da&&pa?"pointer":null).on("mouseover",function(a,b){if(!bb){var d=k.data.targets.map(function(a){return Cb(a.values[b])}),c,h;if(0",d,c,e;for(d=0;d"+e+""+ -c+"";return b+""}),fd=c(["tooltip","init","show"],!1),Aa=c(["tooltip","init","x"],0),sc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),sb=ua.replace("#","")+"-clip",Ma="url(#"+sb+")",z="timeseries"===vc,Z="categorized"===vc,Vb=!z&&na,xb=null,bb=!1,wb=!1,ja=za?40:0,ma=e.time.format(ld).parse,T=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===d.indexOf(b)&& -d.push(b);return c[d.indexOf(b)%c.length]}}(md,nd),Bc=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"),function(a){return a.getSeconds()}],[e.time.format(".%L"), -function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Fb,Mb,Hb,Ta,Lb,Nb,q,t,ka,fb,va,Ob,Pb,ib,jb,l,y,R,Y,Ua,Va,J,la,Wa,Ca,xc=f?"left":"bottom",yc=f?hb?"top":"bottom":hb?"right":"left",zc=f?gb?"bottom":"top":gb?"left":"right",Ac="bottom",K={main:function(){return"translate("+B+","+w+")"},context:function(){return"translate("+H+","+Ba+")"},legend:function(){return"translate("+Bb+","+Ab+")"},y2:function(){return"translate("+(f? -0:q)+","+(f?10:0)+")"},x:function(){return"translate(0,"+t+")"},subx:function(){return"translate(0,"+ka+")"}},hd=function(){var a=e.svg.line().x(f?function(a){return E(a.id)(a.value)}:$a).y(f?$a:function(a){return E(a.id)(a.value)});return function(b){var d=jc(b.values),c;if(pb(b))return"spline"===ba["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0a?0:a}function Db(a){var b=Ha[a.id];a.name=p(b)?b:a.id;return a}function Ub(a){var b=a[0],d={},h=[],m,e;for(m=1;mv[d].indexOf(e.id)))for(h=0;h=g;g+=t)r+=e(a[c-1],a[c],g,u)}return r}function sb(a){var b=k.data.targets=Ia(a),d,c;lc=e.select(ua);if(lc.empty())ha.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{Q(); +Ab();l.domain(e.extent(a.map(function(a){return a.x})));y.domain(ja("y"));R.domain(ja("y2"));Z.domain(l.domain());Ua.domain(y.domain());Va.domain(R.domain());J.ticks(10>a.length?a.length:10);ma.ticks(Vc).outerTickSize(0).tickFormat(Wc);Wa.ticks(Xc).outerTickSize(0).tickFormat(Yc);S=l.domain();F.x(Z);oa&&G.x(l);La=e.select(ua).append("svg").attr("width",q+B+A).attr("height",t+w+Y).on("mouseenter",Zc).on("mouseleave",$c);ab=La.append("defs");ab.append("clipPath").attr("id",tb).append("rect").attr("y", +w).attr("width",q).attr("height",t-w);ab.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-B).attr("y",-20).attr("width",W).attr("height",X);ab.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-B+1).attr("y",w-1).attr("width",ia).attr("height",eb);g=La.append("g").attr("transform",K.main);x=xa?La.append("g").attr("transform",K.context):null;ya=za?La.append("g").attr("transform",K.legend):null;da=e.select(ua).style("position","relative").append("div").style("position", +"absolute").style("width","30%").style("z-index","10").style("visibility","hidden");g.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?ma:J).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(ad);g.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?J:ma).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor", +"end").text(bd);Kb&&g.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Wa);d=g.append("g").attr("clip-path",Ma).attr("class","grid");mc&&d.append("g").attr("class","xgrids");ub&&(c=d.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(ub).enter().append("g").attr("class","xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx", +f?0:-w).attr("dy",-6).text(function(a){return a.text}));cd&&d.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?q:-10).attr("y1",f?-10:w).attr("y2",f?-10:t);nc&&d.append("g").attr("class","ygrids");vb&&d.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(vb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});g.append("g").attr("clip-path",Ma).attr("class","regions");g.append("g").attr("clip-path", +Ma).attr("class","chart");g.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",oa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ea&&pa?"pointer":null).on("mouseover",function(a,b){if(!bb){var d=k.data.targets.map(function(a){return Db(a.values[b])}),c,h;if(0",d,c,e;for(d=0;d"+e+""+c+"";return b+""}),fd=c(["tooltip","init","show"],!1),Aa=c(["tooltip","init","x"],0),sc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),tb=ua.replace("#","")+"-clip",Ma="url(#"+tb+")",z="timeseries"===vc,$="categorized"===vc,kb=!z&&T,yb=null,bb=!1,xb=!1,ka=za?40:0,na=e.time.format(ld).parse,U=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" "); +return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(md,nd),Bc=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"), +function(a){return a.getSeconds()}],[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Gb,Nb,Ib,Ta,Mb,Ob,q,t,la,fb,va,Pb,Qb,ib,jb,l,y,R,Z,Ua,Va,J,ma,Wa,Ca,xc=f?"left":"bottom",yc=f?hb?"top":"bottom":hb?"right":"left",zc=f?gb?"bottom":"top":gb?"left":"right",Ac="bottom",K={main:function(){return"translate("+B+","+w+")"},context:function(){return"translate("+H+","+Ba+")"},legend:function(){return"translate("+ +Cb+","+Bb+")"},y2:function(){return"translate("+(f?0:q)+","+(f?10:0)+")"},x:function(){return"translate(0,"+t+")"},subx:function(){return"translate(0,"+la+")"}},hd=function(){var a=e.svg.line().x(f?function(a){return E(a.id)(a.value)}:$a).y(f?$a:function(a){return E(a.id)(a.value)});return function(b){var d=jc(b.values),c;if(qb(b))return"spline"===ca["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return L};k.data.get=function(a){a=k.data.getAsTarget(a);return p(a)?a.values.map(function(a){return a.value}):void 0};k.data.getAsTarget=function(a){var b= -Xa(function(b){return b.id===a});return 0 Date: Mon, 27 Jan 2014 18:56:44 +0900 Subject: [PATCH 05/31] Add destory() as destructor and fix duplicated chart generation - #6 --- c3.js | 31 +++++++++---- c3.min.js | 135 +++++++++++++++++++++++++++--------------------------- 2 files changed, 90 insertions(+), 76 deletions(-) diff --git a/c3.js b/c3.js index 4116653..1437ee4 100644 --- a/c3.js +++ b/c3.js @@ -903,7 +903,6 @@ var firstDate = null, lastDate = null, orgXDomain; function init(data) { - var targets = c3.data.targets = convertDataToTargets(data); var grid, xgridLine; var i; @@ -911,8 +910,13 @@ if (selectChart.empty()) { window.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".'); return; + } else { + selectChart.html(""); } + c3.data.x = undefined; + c3.data.targets = convertDataToTargets(data); + // TODO: set names if names not specified // Init sizes and scales @@ -1326,10 +1330,10 @@ /*-- Legend Region --*/ - if (__legend_show) { updateLegend(targets); } + if (__legend_show) { updateLegend(c3.data.targets); } // Set targets - updateTargets(targets); + updateTargets(c3.data.targets); // Draw with targets redraw({withTransition: false, withUpdateXDomain: true}); @@ -1338,18 +1342,23 @@ if (__tooltip_init_show) { if (isTimeSeries && typeof __tooltip_init_x === 'string') { __tooltip_init_x = parseDate(__tooltip_init_x); - for (i = 0; i < targets[0].values.length; i++) { - if ((targets[0].values[i].x - __tooltip_init_x) === 0) { break; } + for (i = 0; i < c3.data.targets[0].values.length; i++) { + if ((c3.data.targets[0].values[i].x - __tooltip_init_x) === 0) { break; } } __tooltip_init_x = i; } - tooltip.html(__tooltip_contents(targets.map(function (d) { + tooltip.html(__tooltip_contents(c3.data.targets.map(function (d) { return addName(d.values[__tooltip_init_x]); }))); tooltip.style("top", __tooltip_init_position.top) .style("left", __tooltip_init_position.left) .style("visibility", "visible"); } + + // Bind resize event + if (window.onresize == null) { + window.onresize = resize; + } } function redraw(options) { @@ -2009,6 +2018,13 @@ return targets.length > 0 ? targets[0] : undefined; }; + c3.destroy = function () { + c3.data.targets = undefined; + c3.data.x = undefined; + selectChart.html(""); + window.onresize = null; + }; + /*-- Load data and init chart with defined functions --*/ if ('url' in config.data) { @@ -2024,9 +2040,6 @@ throw Error('url or rows or columns is required.'); } - // Bind resize event - window.onresize = resize; - return c3; }; diff --git a/c3.min.js b/c3.min.js index b475199..baecd49 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,67 +1,68 @@ -(function(ha){function wc(){function p(e,c){e.attr("transform",function(e){return"translate("+(c(e)+W)+", 0)"})}function s(e,c){e.attr("transform",function(e){return"translate(0,"+c(e)+")"})}function ha(e){var c=e[0];e=e[e.length-1];return ca?0:a}function Db(a){var b=Ha[a.id];a.name=p(b)?b:a.id;return a}function Ub(a){var b=a[0],d={},h=[],m,e;for(m=1;mv[d].indexOf(e.id)))for(h=0;h=g;g+=t)r+=e(a[c-1],a[c],g,u)}return r}function sb(a){var b=k.data.targets=Ia(a),d,c;lc=e.select(ua);if(lc.empty())ha.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{Q(); -Ab();l.domain(e.extent(a.map(function(a){return a.x})));y.domain(ja("y"));R.domain(ja("y2"));Z.domain(l.domain());Ua.domain(y.domain());Va.domain(R.domain());J.ticks(10>a.length?a.length:10);ma.ticks(Vc).outerTickSize(0).tickFormat(Wc);Wa.ticks(Xc).outerTickSize(0).tickFormat(Yc);S=l.domain();F.x(Z);oa&&G.x(l);La=e.select(ua).append("svg").attr("width",q+B+A).attr("height",t+w+Y).on("mouseenter",Zc).on("mouseleave",$c);ab=La.append("defs");ab.append("clipPath").attr("id",tb).append("rect").attr("y", -w).attr("width",q).attr("height",t-w);ab.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-B).attr("y",-20).attr("width",W).attr("height",X);ab.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-B+1).attr("y",w-1).attr("width",ia).attr("height",eb);g=La.append("g").attr("transform",K.main);x=xa?La.append("g").attr("transform",K.context):null;ya=za?La.append("g").attr("transform",K.legend):null;da=e.select(ua).style("position","relative").append("div").style("position", -"absolute").style("width","30%").style("z-index","10").style("visibility","hidden");g.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?ma:J).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(ad);g.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?J:ma).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor", -"end").text(bd);Kb&&g.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Wa);d=g.append("g").attr("clip-path",Ma).attr("class","grid");mc&&d.append("g").attr("class","xgrids");ub&&(c=d.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(ub).enter().append("g").attr("class","xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx", -f?0:-w).attr("dy",-6).text(function(a){return a.text}));cd&&d.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?q:-10).attr("y1",f?-10:w).attr("y2",f?-10:t);nc&&d.append("g").attr("class","ygrids");vb&&d.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(vb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});g.append("g").attr("clip-path",Ma).attr("class","regions");g.append("g").attr("clip-path", -Ma).attr("class","chart");g.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",oa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ea&&pa?"pointer":null).on("mouseover",function(a,b){if(!bb){var d=k.data.targets.map(function(a){return Db(a.values[b])}),c,h;if(0",d,c,e;for(d=0;d"+e+""+c+"";return b+""}),fd=c(["tooltip","init","show"],!1),Aa=c(["tooltip","init","x"],0),sc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),tb=ua.replace("#","")+"-clip",Ma="url(#"+tb+")",z="timeseries"===vc,$="categorized"===vc,kb=!z&&T,yb=null,bb=!1,xb=!1,ka=za?40:0,na=e.time.format(ld).parse,U=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" "); -return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(md,nd),Bc=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"), -function(a){return a.getSeconds()}],[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Gb,Nb,Ib,Ta,Mb,Ob,q,t,la,fb,va,Pb,Qb,ib,jb,l,y,R,Z,Ua,Va,J,ma,Wa,Ca,xc=f?"left":"bottom",yc=f?hb?"top":"bottom":hb?"right":"left",zc=f?gb?"bottom":"top":gb?"left":"right",Ac="bottom",K={main:function(){return"translate("+B+","+w+")"},context:function(){return"translate("+H+","+Ba+")"},legend:function(){return"translate("+ -Cb+","+Bb+")"},y2:function(){return"translate("+(f?0:q)+","+(f?10:0)+")"},x:function(){return"translate(0,"+t+")"},subx:function(){return"translate(0,"+la+")"}},hd=function(){var a=e.svg.line().x(f?function(a){return E(a.id)(a.value)}:$a).y(f?$a:function(a){return E(a.id)(a.value)});return function(b){var d=jc(b.values),c;if(qb(b))return"spline"===ca["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return L};k.data.get=function(a){a=k.data.getAsTarget(a);return p(a)?a.values.map(function(a){return a.value}):void 0};k.data.getAsTarget=function(a){var b= -Xa(function(b){return b.id===a});return 0a?0:a}function Eb(a){var b=Ha[a.id];a.name=n(b)?b:a.id;return a}function Vb(a){var b=a[0],c={},g=[],p,e;for(p=1;pw[c].indexOf(e.id)))for(g=0;g=q;q+=v)k+=e(a[d-1],a[d],q,u)}return k}function tb(a){var b,c;ab=e.select(ua);if(ab.empty())P.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{ab.html("");k.data.x=void 0; +k.data.targets=Ia(a);R();Bb();m.domain(e.extent(a.map(function(a){return a.x})));y.domain(ja("y"));S.domain(ja("y2"));$.domain(m.domain());Ua.domain(y.domain());Va.domain(S.domain());J.ticks(10>a.length?a.length:10);ma.ticks(Uc).outerTickSize(0).tickFormat(Vc);Wa.ticks(Wc).outerTickSize(0).tickFormat(Xc);T=m.domain();F.x($);oa&&G.x(m);La=e.select(ua).append("svg").attr("width",s+B+A).attr("height",r+v+Z).on("mouseenter",Yc).on("mouseleave",Zc);bb=La.append("defs");bb.append("clipPath").attr("id", +ub).append("rect").attr("y",v).attr("width",s).attr("height",r-v);bb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-B).attr("y",-20).attr("width",X).attr("height",Y);bb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-B+1).attr("y",v-1).attr("width",ia).attr("height",fb);h=La.append("g").attr("transform",K.main);x=xa?La.append("g").attr("transform",K.context):null;ya=za?La.append("g").attr("transform",K.legend):null;ea=e.select(ua).style("position","relative").append("div").style("position", +"absolute").style("width","30%").style("z-index","10").style("visibility","hidden");h.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?ma:J).append("text").attr("class","-axis-x-label").attr("x",s).attr("dy","-.5em").style("text-anchor","end").text($c);h.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?J:ma).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor", +"end").text(ad);Lb&&h.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Wa);b=h.append("g").attr("clip-path",Ma).attr("class","grid");lc&&b.append("g").attr("class","xgrids");vb&&(c=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(vb).enter().append("g").attr("class","xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx", +f?0:-v).attr("dy",-6).text(function(a){return a.text}));bd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?s:-10).attr("y1",f?-10:v).attr("y2",f?-10:r);mc&&b.append("g").attr("class","ygrids");wb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(wb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});h.append("g").attr("clip-path",Ma).attr("class","regions");h.append("g").attr("clip-path", +Ma).attr("class","chart");h.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",oa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",fa&&pa?"pointer":null).on("mouseover",function(a,b){if(!cb){var c=k.data.targets.map(function(a){return Eb(a.values[b])}),d,n;if(0",c,d,e;for(c=0;c"+e+""+d+"";return b+""}),ed=d(["tooltip","init","show"],!1),Aa=d(["tooltip","init","x"],0),rc= +d(["tooltip","init","position"],{top:"0px",left:"50px"}),ub=ua.replace("#","")+"-clip",Ma="url(#"+ub+")",z="timeseries"===uc,aa="categorized"===uc,lb=!z&&U,zb=null,cb=!1,yb=!1,ka=za?40:0,na=e.time.format(ld).parse,V=function(a,b){var c=[],d=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===c.indexOf(b)&&c.push(b);return d[c.indexOf(b)%d.length]}}(md,nd),Ac=function(){var a=[[e.time.format("%Y/%-m/%-d"), +function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"),function(a){return a.getSeconds()}],[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,d= +a[c];!d[1](b);)d=a[--c];return d[0](b)}}(),Hb,Ob,Jb,Ta,Nb,Pb,s,r,la,gb,va,Qb,Rb,jb,kb,m,y,S,$,Ua,Va,J,ma,Wa,Ca,wc=f?"left":"bottom",xc=f?ib?"top":"bottom":ib?"right":"left",yc=f?hb?"bottom":"top":hb?"left":"right",zc="bottom",K={main:function(){return"translate("+B+","+v+")"},context:function(){return"translate("+H+","+Ba+")"},legend:function(){return"translate("+Db+","+Cb+")"},y2:function(){return"translate("+(f?0:s)+","+(f?10:0)+")"},x:function(){return"translate(0,"+r+")"},subx:function(){return"translate(0,"+ +la+")"}},hd=function(){var a=e.svg.line().x(f?function(a){return E(a.id)(a.value)}:$a).y(f?$a:function(a){return E(a.id)(a.value)});return function(b){var c=kc(b.values),d;if(rb(b))return"spline"===da["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return L};k.data.get=function(a){a=k.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};k.data.getAsTarget=function(a){var b=Xa(function(b){return b.id===a});return 0 Date: Tue, 28 Jan 2014 15:52:43 +0900 Subject: [PATCH 06/31] Fix jshint --- c3.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/c3.js b/c3.js index 4618a5a..8cf08d5 100644 --- a/c3.js +++ b/c3.js @@ -1156,11 +1156,11 @@ // Set tooltip // todo get rid of magic numbers tooltip - .style("top", (d3.mouse(this)[1] + 15 + tHeight < getCurrentHeight() ? d3.mouse(this)[1] + 15 : d3.mouse(this)[1] - tHeight ) + "px") + .style("top", (d3.mouse(this)[1] + 15 + tHeight < getCurrentHeight() ? d3.mouse(this)[1] + 15 : d3.mouse(this)[1] - tHeight) + "px") .style("left", ((__axis_rotated ? d3.mouse(this)[0] : (x(selectedData[0].x) + 60 + tWidth < getCurrentWidth()) ? - (x(selectedData[0].x) + 60) +"px" : (x(selectedData[0].x) - tWidth + 30) + "px" + (x(selectedData[0].x) + 60) + "px" : (x(selectedData[0].x) - tWidth + 30) + "px" ))) .style("visibility", "visible"); From 851a8be5afefba37d1ce26b5e7c0a8daaea9a8f8 Mon Sep 17 00:00:00 2001 From: Masayuki Tanaka Date: Tue, 28 Jan 2014 15:54:25 +0900 Subject: [PATCH 07/31] Update c3.min.js --- c3.min.js | 136 +++++++++++++++++++++++++++--------------------------- 1 file changed, 68 insertions(+), 68 deletions(-) diff --git a/c3.min.js b/c3.min.js index baecd49..4fb663a 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,68 +1,68 @@ -(function(P){function vc(){function n(e,d){e.attr("transform",function(e){return"translate("+(d(e)+X)+", 0)"})}function t(e,d){e.attr("transform",function(e){return"translate(0,"+d(e)+")"})}function P(e){var d=e[0];e=e[e.length-1];return da?0:a}function Eb(a){var b=Ha[a.id];a.name=n(b)?b:a.id;return a}function Vb(a){var b=a[0],c={},g=[],p,e;for(p=1;pw[c].indexOf(e.id)))for(g=0;g=q;q+=v)k+=e(a[d-1],a[d],q,u)}return k}function tb(a){var b,c;ab=e.select(ua);if(ab.empty())P.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{ab.html("");k.data.x=void 0; -k.data.targets=Ia(a);R();Bb();m.domain(e.extent(a.map(function(a){return a.x})));y.domain(ja("y"));S.domain(ja("y2"));$.domain(m.domain());Ua.domain(y.domain());Va.domain(S.domain());J.ticks(10>a.length?a.length:10);ma.ticks(Uc).outerTickSize(0).tickFormat(Vc);Wa.ticks(Wc).outerTickSize(0).tickFormat(Xc);T=m.domain();F.x($);oa&&G.x(m);La=e.select(ua).append("svg").attr("width",s+B+A).attr("height",r+v+Z).on("mouseenter",Yc).on("mouseleave",Zc);bb=La.append("defs");bb.append("clipPath").attr("id", -ub).append("rect").attr("y",v).attr("width",s).attr("height",r-v);bb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-B).attr("y",-20).attr("width",X).attr("height",Y);bb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-B+1).attr("y",v-1).attr("width",ia).attr("height",fb);h=La.append("g").attr("transform",K.main);x=xa?La.append("g").attr("transform",K.context):null;ya=za?La.append("g").attr("transform",K.legend):null;ea=e.select(ua).style("position","relative").append("div").style("position", -"absolute").style("width","30%").style("z-index","10").style("visibility","hidden");h.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?ma:J).append("text").attr("class","-axis-x-label").attr("x",s).attr("dy","-.5em").style("text-anchor","end").text($c);h.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?J:ma).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor", -"end").text(ad);Lb&&h.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Wa);b=h.append("g").attr("clip-path",Ma).attr("class","grid");lc&&b.append("g").attr("class","xgrids");vb&&(c=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(vb).enter().append("g").attr("class","xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx", -f?0:-v).attr("dy",-6).text(function(a){return a.text}));bd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?s:-10).attr("y1",f?-10:v).attr("y2",f?-10:r);mc&&b.append("g").attr("class","ygrids");wb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(wb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});h.append("g").attr("clip-path",Ma).attr("class","regions");h.append("g").attr("clip-path", -Ma).attr("class","chart");h.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",oa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",fa&&pa?"pointer":null).on("mouseover",function(a,b){if(!cb){var c=k.data.targets.map(function(a){return Eb(a.values[b])}),d,n;if(0",c,d,e;for(c=0;c"+e+""+d+"";return b+""}),ed=d(["tooltip","init","show"],!1),Aa=d(["tooltip","init","x"],0),rc= -d(["tooltip","init","position"],{top:"0px",left:"50px"}),ub=ua.replace("#","")+"-clip",Ma="url(#"+ub+")",z="timeseries"===uc,aa="categorized"===uc,lb=!z&&U,zb=null,cb=!1,yb=!1,ka=za?40:0,na=e.time.format(ld).parse,V=function(a,b){var c=[],d=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===c.indexOf(b)&&c.push(b);return d[c.indexOf(b)%d.length]}}(md,nd),Ac=function(){var a=[[e.time.format("%Y/%-m/%-d"), -function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"),function(a){return a.getSeconds()}],[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,d= -a[c];!d[1](b);)d=a[--c];return d[0](b)}}(),Hb,Ob,Jb,Ta,Nb,Pb,s,r,la,gb,va,Qb,Rb,jb,kb,m,y,S,$,Ua,Va,J,ma,Wa,Ca,wc=f?"left":"bottom",xc=f?ib?"top":"bottom":ib?"right":"left",yc=f?hb?"bottom":"top":hb?"left":"right",zc="bottom",K={main:function(){return"translate("+B+","+v+")"},context:function(){return"translate("+H+","+Ba+")"},legend:function(){return"translate("+Db+","+Cb+")"},y2:function(){return"translate("+(f?0:s)+","+(f?10:0)+")"},x:function(){return"translate(0,"+r+")"},subx:function(){return"translate(0,"+ -la+")"}},hd=function(){var a=e.svg.line().x(f?function(a){return E(a.id)(a.value)}:$a).y(f?$a:function(a){return E(a.id)(a.value)});return function(b){var c=kc(b.values),d;if(rb(b))return"spline"===da["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return L};k.data.get=function(a){a=k.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};k.data.getAsTarget=function(a){var b=Xa(function(b){return b.id===a});return 0a?0:a}function nb(a){var b=Ga[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b=a[0],d={},g=[],p,e;for(p=1;pw[d].indexOf(e.id)))for(g=0;g=h;h+=v)s+=e(a[c-1],a[c],h,u)}return s}function wb(a){var b,d;bb=e.select(ua);if(bb.empty())M.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{bb.html("");h.data.x=void 0; +h.data.targets=Ha(a);R();O();l.domain(e.extent(a.map(function(a){return a.x})));z.domain(Q("y"));T.domain(Q("y2"));ca.domain(l.domain());Va.domain(z.domain());Wa.domain(T.domain());I.ticks(10>a.length?a.length:10);na.ticks(Wc).outerTickSize(0).tickFormat(Xc);Xa.ticks(Yc).outerTickSize(0).tickFormat(Zc);U=l.domain();E.x(ca);pa&&F.x(l);Ka=e.select(ua).append("svg").attr("width",r+C+B).attr("height",q+v+ba).on("mouseenter",$c).on("mouseleave",ad);cb=Ka.append("defs");cb.append("clipPath").attr("id", +xb).append("rect").attr("y",v).attr("width",r).attr("height",q-v);cb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-C).attr("y",-20).attr("width",Z).attr("height",hb);cb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-C+1).attr("y",v-1).attr("width",xc).attr("height",N);k=Ka.append("g").attr("transform",J.main);x=wa?Ka.append("g").attr("transform",J.context):null;xa=ya?Ka.append("g").attr("transform",J.legend):null;X=e.select(ua).style("position","relative").append("div").style("position", +"absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",J.x).call(f?na:I).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(bd);k.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?I:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(cd);Kb&& +k.append("g").attr("class","y2 axis").attr("transform",J.y2).call(Xa);b=k.append("g").attr("clip-path",La).attr("class","grid");mc&&b.append("g").attr("class","xgrids");yb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(yb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx",f? +0:-v).attr("dy",-6).text(function(a){return a.text}));dd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?r:-10).attr("y1",f?-10:v).attr("y2",f?-10:q);nc&&b.append("g").attr("class","ygrids");zb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(zb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",La).attr("class","regions");k.append("g").attr("clip-path", +La).attr("class","chart");k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",pa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ha&&qa?"pointer":null).on("mouseover",function(a,b){if(!db){var d=h.data.targets.map(function(a){return nb(a.values[b])}),e,c;if(0",d,c,e;for(d=0;d"+e+""+c+"";return b+""}),gd=c(["tooltip","init","show"],!1),za=c(["tooltip","init","x"],0),sc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),xb=ua.replace("#","")+"-clip",La="url(#"+xb+")",A="timeseries"===vc,da="categorized"===vc,ob=!A&&V,Cb=null,db=!1,Bb=!1,la=ya?40:0,oa=e.time.format(nd).parse,W=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" "); +return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(od,pd),Cc=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"), +function(a){return a.getSeconds()}],[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Gb,Nb,Ib,Ua,Mb,Ob,r,q,ma,ib,ta,Qb,Rb,lb,mb,l,z,T,ca,Va,Wa,I,na,Xa,Ba,yc=f?"left":"bottom",zc=f?kb?"top":"bottom":kb?"right":"left",Ac=f?jb?"bottom":"top":jb?"left":"right",Bc="bottom",J={main:function(){return"translate("+C+","+v+")"},context:function(){return"translate("+G+","+Aa+")"},legend:function(){return"translate("+ +Fb+","+Eb+")"},y2:function(){return"translate("+(f?0:r)+","+(f?10:0)+")"},x:function(){return"translate(0,"+q+")"},subx:function(){return"translate(0,"+ma+")"}},jd=function(){var a=e.svg.line().x(f?function(a){return y(a.id)(a.value)}:ab).y(f?ab:function(a){return y(a.id)(a.value)});return function(b){var d=lc(b.values),c;if(ub(b))return"spline"===ga["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return K};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b= +Ya(function(b){return b.id===a});return 0 Date: Tue, 28 Jan 2014 15:59:39 +0900 Subject: [PATCH 08/31] Update version --- bower.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/bower.json b/bower.json index 3cb3678..6f96028 100644 --- a/bower.json +++ b/bower.json @@ -1,7 +1,7 @@ { "name": "c3", "main": "c3.min.js", - "version": "0.1.3", + "version": "0.1.4", "homepage": "https://github.com/masayuki0812/c3", "authors": [ "Masayuki Tanaka " diff --git a/package.json b/package.json index 3a34639..4c80e2e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "c3", - "version": "0.1.3", + "version": "0.1.4", "description": "D3-based reusable chart library", "main": "c3.js", "scripts": { From 26af06f4b760580b6e9f93187387a717b90e2810 Mon Sep 17 00:00:00 2001 From: Masayuki Tanaka Date: Thu, 30 Jan 2014 12:55:40 +0900 Subject: [PATCH 09/31] Add x format for none timeseries data --- c3.js | 11 ++++- c3.min.js | 136 +++++++++++++++++++++++++++--------------------------- 2 files changed, 77 insertions(+), 70 deletions(-) diff --git a/c3.js b/c3.js index 8cf08d5..dea2968 100644 --- a/c3.js +++ b/c3.js @@ -329,15 +329,22 @@ function getXAxis(scale, orient) { var axis = (isCategorized ? categoryAxis() : d3.svg.axis()).scale(scale).orient(orient); - if (isTimeSeries) { - axis.tickFormat(__axis_x_tick_format ? function (date) { return d3.time.format(__axis_x_tick_format)(date); } : defaultTimeFormat); + var tickFormat = isTimeSeries ? defaultTimeFormat : null; + + // Set tick format + if (__axis_x_tick_format) { + tickFormat = typeof __axis_x_tick_format === 'function' ? __axis_x_tick_format : isTimeSeries ? function (date) { return d3.time.format(__axis_x_tick_format)(date); } : null; } + axis.tickFormat(tickFormat); + + // Set categories if (isCategorized) { axis.categories(__axis_x_categories).tickCentered(__axis_x_tick_centered); } else { // TODO: fix axis.tickOffset = function () { return 0; }; } + return axis; } function getYAxis(scale, orient) { diff --git a/c3.min.js b/c3.min.js index 4fb663a..cddd5a3 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,68 +1,68 @@ -(function(M){function wc(){function n(e,c){e.attr("transform",function(e){return"translate("+(c(e)+$)+", 0)"})}function t(e,c){e.attr("transform",function(e){return"translate(0,"+c(e)+")"})}function M(e){var c=e[0];e=e[e.length-1];return ca?0:a}function nb(a){var b=Ga[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b=a[0],d={},g=[],p,e;for(p=1;pw[d].indexOf(e.id)))for(g=0;g=h;h+=v)s+=e(a[c-1],a[c],h,u)}return s}function wb(a){var b,d;bb=e.select(ua);if(bb.empty())M.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{bb.html("");h.data.x=void 0; -h.data.targets=Ha(a);R();O();l.domain(e.extent(a.map(function(a){return a.x})));z.domain(Q("y"));T.domain(Q("y2"));ca.domain(l.domain());Va.domain(z.domain());Wa.domain(T.domain());I.ticks(10>a.length?a.length:10);na.ticks(Wc).outerTickSize(0).tickFormat(Xc);Xa.ticks(Yc).outerTickSize(0).tickFormat(Zc);U=l.domain();E.x(ca);pa&&F.x(l);Ka=e.select(ua).append("svg").attr("width",r+C+B).attr("height",q+v+ba).on("mouseenter",$c).on("mouseleave",ad);cb=Ka.append("defs");cb.append("clipPath").attr("id", -xb).append("rect").attr("y",v).attr("width",r).attr("height",q-v);cb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-C).attr("y",-20).attr("width",Z).attr("height",hb);cb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-C+1).attr("y",v-1).attr("width",xc).attr("height",N);k=Ka.append("g").attr("transform",J.main);x=wa?Ka.append("g").attr("transform",J.context):null;xa=ya?Ka.append("g").attr("transform",J.legend):null;X=e.select(ua).style("position","relative").append("div").style("position", -"absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",J.x).call(f?na:I).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(bd);k.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?I:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(cd);Kb&& -k.append("g").attr("class","y2 axis").attr("transform",J.y2).call(Xa);b=k.append("g").attr("clip-path",La).attr("class","grid");mc&&b.append("g").attr("class","xgrids");yb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(yb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx",f? -0:-v).attr("dy",-6).text(function(a){return a.text}));dd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?r:-10).attr("y1",f?-10:v).attr("y2",f?-10:q);nc&&b.append("g").attr("class","ygrids");zb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(zb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",La).attr("class","regions");k.append("g").attr("clip-path", -La).attr("class","chart");k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",pa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ha&&qa?"pointer":null).on("mouseover",function(a,b){if(!db){var d=h.data.targets.map(function(a){return nb(a.values[b])}),e,c;if(0",d,c,e;for(d=0;d"+e+""+c+"";return b+""}),gd=c(["tooltip","init","show"],!1),za=c(["tooltip","init","x"],0),sc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),xb=ua.replace("#","")+"-clip",La="url(#"+xb+")",A="timeseries"===vc,da="categorized"===vc,ob=!A&&V,Cb=null,db=!1,Bb=!1,la=ya?40:0,oa=e.time.format(nd).parse,W=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" "); -return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(od,pd),Cc=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"), -function(a){return a.getSeconds()}],[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Gb,Nb,Ib,Ua,Mb,Ob,r,q,ma,ib,ta,Qb,Rb,lb,mb,l,z,T,ca,Va,Wa,I,na,Xa,Ba,yc=f?"left":"bottom",zc=f?kb?"top":"bottom":kb?"right":"left",Ac=f?jb?"bottom":"top":jb?"left":"right",Bc="bottom",J={main:function(){return"translate("+C+","+v+")"},context:function(){return"translate("+G+","+Aa+")"},legend:function(){return"translate("+ -Fb+","+Eb+")"},y2:function(){return"translate("+(f?0:r)+","+(f?10:0)+")"},x:function(){return"translate(0,"+q+")"},subx:function(){return"translate(0,"+ma+")"}},jd=function(){var a=e.svg.line().x(f?function(a){return y(a.id)(a.value)}:ab).y(f?ab:function(a){return y(a.id)(a.value)});return function(b){var d=lc(b.values),c;if(ub(b))return"spline"===ga["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return K};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b= -Ya(function(b){return b.id===a});return 0a?0:a}function ob(a){var b=Ga[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b= +a[0],c={},f=[],q,d;for(q=1;q +w[c].indexOf(d.id)))for(f=0;f=e;e+=v)k+=f(a[d-1],a[d],e,t)}return k}function xb(a){var b,c;cb=d.select(ua);if(cb.empty())M.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".'); +else{cb.html("");k.data.x=void 0;k.data.targets=Ha(a);R();O();l.domain(d.extent(a.map(function(a){return a.x})));z.domain(Q("y"));T.domain(Q("y2"));ca.domain(l.domain());Va.domain(z.domain());Wa.domain(T.domain());I.ticks(10>a.length?a.length:10);na.ticks(Wc).outerTickSize(0).tickFormat(Xc);Xa.ticks(Yc).outerTickSize(0).tickFormat(Zc);U=l.domain();E.x(ca);pa&&F.x(l);Ka=d.select(ua).append("svg").attr("width",r+C+B).attr("height",p+v+ba).on("mouseenter",$c).on("mouseleave",ad);db=Ka.append("defs"); +db.append("clipPath").attr("id",yb).append("rect").attr("y",v).attr("width",r).attr("height",p-v);db.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-C).attr("y",-20).attr("width",Z).attr("height",ib);db.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-C+1).attr("y",v-1).attr("width",xc).attr("height",N);h=Ka.append("g").attr("transform",J.main);x=wa?Ka.append("g").attr("transform",J.context):null;xa=ya?Ka.append("g").attr("transform",J.legend):null;X=d.select(ua).style("position", +"relative").append("div").style("position","absolute").style("z-index","10").style("display","none");h.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",J.x).call(g?na:I).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(bd);h.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?I:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor", +"end").text(cd);Lb&&h.append("g").attr("class","y2 axis").attr("transform",J.y2).call(Xa);b=h.append("g").attr("clip-path",La).attr("class","grid");mc&&b.append("g").attr("class","xgrids");zb&&(c=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(zb).enter().append("g").attr("class","xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx", +g?0:-v).attr("dy",-6).text(function(a){return a.text}));dd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2",g?r:-10).attr("y1",g?-10:v).attr("y2",g?-10:p);nc&&b.append("g").attr("class","ygrids");Ab&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Ab).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});h.append("g").attr("clip-path",La).attr("class","regions");h.append("g").attr("clip-path", +La).attr("class","chart");h.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",pa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ha&&qa?"pointer":null).on("mouseover",function(a,b){if(!eb){var c=k.data.targets.map(function(a){return ob(a.values[b])}),d,e;if(0",c,d,e;for(c=0;c"+e+""+d+"";return b+""}),gd=e(["tooltip","init","show"],!1),za=e(["tooltip","init","x"],0),sc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),yb=ua.replace("#","")+"-clip",La="url(#"+yb+")",A="timeseries"===vc,da="categorized"===vc,pb=!A&&V,Db=null,eb=!1,Cb=!1,la=ya?40:0,oa=d.time.format(nd).parse,W=function(a,b){var c=[],d=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" "); +return function(b){if(b in a)return a[b];-1===c.indexOf(b)&&c.push(b);return d[c.indexOf(b)%d.length]}}(od,pd),Cc=function(){var a=[[d.time.format("%Y/%-m/%-d"),function(){return!0}],[d.time.format("%-m/%-d"),function(a){return a.getMonth()}],[d.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[d.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[d.time.format("%I %p"),function(a){return a.getHours()}],[d.time.format("%I:%M"),function(a){return a.getMinutes()}],[d.time.format(":%S"), +function(a){return a.getSeconds()}],[d.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,d=a[c];!d[1](b);)d=a[--c];return d[0](b)}}(),Hb,Ob,Jb,Ua,Nb,Pb,r,p,ma,jb,ta,Rb,Sb,mb,nb,l,z,T,ca,Va,Wa,I,na,Xa,Ba,yc=g?"left":"bottom",zc=g?lb?"top":"bottom":lb?"right":"left",Ac=g?kb?"bottom":"top":kb?"left":"right",Bc="bottom",J={main:function(){return"translate("+C+","+v+")"},context:function(){return"translate("+G+","+Aa+")"},legend:function(){return"translate("+ +Gb+","+Fb+")"},y2:function(){return"translate("+(g?0:r)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+ma+")"}},jd=function(){var a=d.svg.line().x(g?function(a){return y(a.id)(a.value)}:bb).y(g?bb:function(a){return y(a.id)(a.value)});return function(b){var c=lc(b.values),d;if(vb(b))return"spline"===ga["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return K};k.data.get=function(a){a=k.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};k.data.getAsTarget=function(a){var b= +Za(function(b){return b.id===a});return 0 Date: Thu, 30 Jan 2014 13:36:40 +0900 Subject: [PATCH 10/31] Fix tooltip title to be formatted --- c3.js | 17 ++++--- c3.min.js | 136 +++++++++++++++++++++++++++--------------------------- 2 files changed, 78 insertions(+), 75 deletions(-) diff --git a/c3.js b/c3.js index dea2968..9110506 100644 --- a/c3.js +++ b/c3.js @@ -128,8 +128,8 @@ // tooltip - show when mouseover on each data var __tooltip_contents = getConfig(['tooltip', 'contents'], function (d) { - var date = isTimeSeries ? d[0].x.getFullYear() + '.' + (d[0].x.getMonth() + 1) + '.' + d[0].x.getDate() : isCategorized ? category(d[0].x) : d[0].x, - text = "", i, value, name; + var title = getXAxisTickFormat()(d[0].x), + text = "
" + date + "
", i, value, name; for (i = 0; i < d.length; i++) { if (isDefined(d[i])) { value = isDefined(d[i].value) ? (Math.round(d[i].value * 100) / 100).toFixed(2) : '-'; @@ -329,13 +329,9 @@ function getXAxis(scale, orient) { var axis = (isCategorized ? categoryAxis() : d3.svg.axis()).scale(scale).orient(orient); - var tickFormat = isTimeSeries ? defaultTimeFormat : null; // Set tick format - if (__axis_x_tick_format) { - tickFormat = typeof __axis_x_tick_format === 'function' ? __axis_x_tick_format : isTimeSeries ? function (date) { return d3.time.format(__axis_x_tick_format)(date); } : null; - } - axis.tickFormat(tickFormat); + axis.tickFormat(getXAxisTickFormat()); // Set categories if (isCategorized) { @@ -353,6 +349,13 @@ function getAxisId(id) { return id in __data_axes ? __data_axes[id] : 'y'; } + function getXAxisTickFormat() { + var tickFormat = isTimeSeries ? defaultTimeFormat : isCategorized ? category : null; + if (__axis_x_tick_format) { + tickFormat = typeof __axis_x_tick_format === 'function' ? __axis_x_tick_format : isTimeSeries ? function (date) { return d3.time.format(__axis_x_tick_format)(date); } : tickFormat; + } + return tickFormat; + } //-- Domain --// diff --git a/c3.min.js b/c3.min.js index cddd5a3..c88992a 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,68 +1,68 @@ -(function(M){function wc(){function n(d,e){d.attr("transform",function(d){return"translate("+(e(d)+$)+", 0)"})}function s(d,e){d.attr("transform",function(d){return"translate(0,"+e(d)+")"})}function M(d){var e=d[0];d=d[d.length-1];return ea?0:a}function ob(a){var b=Ga[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b= -a[0],c={},f=[],q,d;for(q=1;q -w[c].indexOf(d.id)))for(f=0;f=e;e+=v)k+=f(a[d-1],a[d],e,t)}return k}function xb(a){var b,c;cb=d.select(ua);if(cb.empty())M.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".'); -else{cb.html("");k.data.x=void 0;k.data.targets=Ha(a);R();O();l.domain(d.extent(a.map(function(a){return a.x})));z.domain(Q("y"));T.domain(Q("y2"));ca.domain(l.domain());Va.domain(z.domain());Wa.domain(T.domain());I.ticks(10>a.length?a.length:10);na.ticks(Wc).outerTickSize(0).tickFormat(Xc);Xa.ticks(Yc).outerTickSize(0).tickFormat(Zc);U=l.domain();E.x(ca);pa&&F.x(l);Ka=d.select(ua).append("svg").attr("width",r+C+B).attr("height",p+v+ba).on("mouseenter",$c).on("mouseleave",ad);db=Ka.append("defs"); -db.append("clipPath").attr("id",yb).append("rect").attr("y",v).attr("width",r).attr("height",p-v);db.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-C).attr("y",-20).attr("width",Z).attr("height",ib);db.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-C+1).attr("y",v-1).attr("width",xc).attr("height",N);h=Ka.append("g").attr("transform",J.main);x=wa?Ka.append("g").attr("transform",J.context):null;xa=ya?Ka.append("g").attr("transform",J.legend):null;X=d.select(ua).style("position", -"relative").append("div").style("position","absolute").style("z-index","10").style("display","none");h.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",J.x).call(g?na:I).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(bd);h.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?I:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor", -"end").text(cd);Lb&&h.append("g").attr("class","y2 axis").attr("transform",J.y2).call(Xa);b=h.append("g").attr("clip-path",La).attr("class","grid");mc&&b.append("g").attr("class","xgrids");zb&&(c=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(zb).enter().append("g").attr("class","xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx", -g?0:-v).attr("dy",-6).text(function(a){return a.text}));dd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2",g?r:-10).attr("y1",g?-10:v).attr("y2",g?-10:p);nc&&b.append("g").attr("class","ygrids");Ab&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Ab).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});h.append("g").attr("clip-path",La).attr("class","regions");h.append("g").attr("clip-path", -La).attr("class","chart");h.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",pa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ha&&qa?"pointer":null).on("mouseover",function(a,b){if(!eb){var c=k.data.targets.map(function(a){return ob(a.values[b])}),d,e;if(0",c,d,e;for(c=0;c";return b+"
" + title + "
"+e+""+d+"
"}),gd=e(["tooltip","init","show"],!1),za=e(["tooltip","init","x"],0),sc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),yb=ua.replace("#","")+"-clip",La="url(#"+yb+")",A="timeseries"===vc,da="categorized"===vc,pb=!A&&V,Db=null,eb=!1,Cb=!1,la=ya?40:0,oa=d.time.format(nd).parse,W=function(a,b){var c=[],d=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" "); -return function(b){if(b in a)return a[b];-1===c.indexOf(b)&&c.push(b);return d[c.indexOf(b)%d.length]}}(od,pd),Cc=function(){var a=[[d.time.format("%Y/%-m/%-d"),function(){return!0}],[d.time.format("%-m/%-d"),function(a){return a.getMonth()}],[d.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[d.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[d.time.format("%I %p"),function(a){return a.getHours()}],[d.time.format("%I:%M"),function(a){return a.getMinutes()}],[d.time.format(":%S"), -function(a){return a.getSeconds()}],[d.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,d=a[c];!d[1](b);)d=a[--c];return d[0](b)}}(),Hb,Ob,Jb,Ua,Nb,Pb,r,p,ma,jb,ta,Rb,Sb,mb,nb,l,z,T,ca,Va,Wa,I,na,Xa,Ba,yc=g?"left":"bottom",zc=g?lb?"top":"bottom":lb?"right":"left",Ac=g?kb?"bottom":"top":kb?"left":"right",Bc="bottom",J={main:function(){return"translate("+C+","+v+")"},context:function(){return"translate("+G+","+Aa+")"},legend:function(){return"translate("+ -Gb+","+Fb+")"},y2:function(){return"translate("+(g?0:r)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+ma+")"}},jd=function(){var a=d.svg.line().x(g?function(a){return y(a.id)(a.value)}:bb).y(g?bb:function(a){return y(a.id)(a.value)});return function(b){var c=lc(b.values),d;if(vb(b))return"spline"===ga["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return K};k.data.get=function(a){a=k.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};k.data.getAsTarget=function(a){var b= -Za(function(b){return b.id===a});return 0a?0:a}function ob(a){var b=Ia[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b= +a[0],d={},g=[],p,e;for(p=1;pw[d].indexOf(e.id)))for(g=0;g=h;h+=v)s+=e(a[c-1],a[c],h,u)}return s}function xb(a){var b,d;cb=e.select(va);if(cb.empty())M.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".'); +else{cb.html("");h.data.x=void 0;h.data.targets=Ja(a);Q();O();l.domain(e.extent(a.map(function(a){return a.x})));z.domain(ka("y"));S.domain(ka("y2"));ba.domain(l.domain());Va.domain(z.domain());Wa.domain(S.domain());I.ticks(10>a.length?a.length:10);na.ticks(Yc).outerTickSize(0).tickFormat(Zc);Xa.ticks($c).outerTickSize(0).tickFormat(ad);T=l.domain();E.x(ba);pa&&F.x(l);Ma=e.select(va).append("svg").attr("width",r+C+B).attr("height",q+v+aa).on("mouseenter",bd).on("mouseleave",cd);db=Ma.append("defs"); +db.append("clipPath").attr("id",yb).append("rect").attr("y",v).attr("width",r).attr("height",q-v);db.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-C).attr("y",-20).attr("width",Y).attr("height",hb);db.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-C+1).attr("y",v-1).attr("width",xc).attr("height",N);k=Ma.append("g").attr("transform",J.main);x=xa?Ma.append("g").attr("transform",J.context):null;ya=za?Ma.append("g").attr("transform",J.legend):null;W=e.select(va).style("position", +"relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",J.x).call(f?na:I).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(dd);k.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?I:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor", +"end").text(ed);Lb&&k.append("g").attr("class","y2 axis").attr("transform",J.y2).call(Xa);b=k.append("g").attr("clip-path",Na).attr("class","grid");mc&&b.append("g").attr("class","xgrids");zb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(zb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx", +f?0:-v).attr("dy",-6).text(function(a){return a.text}));fd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?r:-10).attr("y1",f?-10:v).attr("y2",f?-10:q);nc&&b.append("g").attr("class","ygrids");Ab&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Ab).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Na).attr("class","regions");k.append("g").attr("clip-path", +Na).attr("class","chart");k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",pa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ga&&qa?"pointer":null).on("mouseover",function(a,b){if(!eb){var d=h.data.targets.map(function(a){return ob(a.values[b])}),e,c;if(0",d,c,e;for(d=0;d"+e+""+ +c+"";return b+""}),id=c(["tooltip","init","show"],!1),Aa=c(["tooltip","init","x"],0),sc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),yb=va.replace("#","")+"-clip",Na="url(#"+yb+")",A="timeseries"===vc,ca="categorized"===vc,pb=!A&&U,Db=null,eb=!1,Cb=!1,la=za?40:0,oa=e.time.format(pd).parse,V=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===d.indexOf(b)&& +d.push(b);return c[d.indexOf(b)%c.length]}}(qd,rd),Ec=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"),function(a){return a.getSeconds()}],[e.time.format(".%L"), +function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Hb,Ob,Jb,Ua,Nb,Pb,r,q,ma,ib,ua,Rb,Sb,lb,mb,l,z,S,ba,Va,Wa,I,na,Xa,Da,zc=f?"left":"bottom",Ac=f?kb?"top":"bottom":kb?"right":"left",Bc=f?jb?"bottom":"top":jb?"left":"right",Cc="bottom",J={main:function(){return"translate("+C+","+v+")"},context:function(){return"translate("+G+","+Ba+")"},legend:function(){return"translate("+Gb+","+Fb+")"},y2:function(){return"translate("+(f? +0:r)+","+(f?10:0)+")"},x:function(){return"translate(0,"+q+")"},subx:function(){return"translate(0,"+ma+")"}},ld=function(){var a=e.svg.line().x(f?function(a){return y(a.id)(a.value)}:bb).y(f?bb:function(a){return y(a.id)(a.value)});return function(b){var d=lc(b.values),c;if(vb(b))return"spline"===fa["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return K};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b= +Za(function(b){return b.id===a});return 0 Date: Thu, 30 Jan 2014 13:49:23 +0900 Subject: [PATCH 11/31] Fix x tick format for categorized axis --- c3.js | 17 +++++-- c3.min.js | 136 +++++++++++++++++++++++++++--------------------------- 2 files changed, 82 insertions(+), 71 deletions(-) diff --git a/c3.js b/c3.js index 9110506..e3621e9 100644 --- a/c3.js +++ b/c3.js @@ -2069,7 +2069,9 @@ }; function categoryAxis() { - var scale = d3.scale.linear(), orient = "bottom", tickMajorSize = 6, /*tickMinorSize = 6,*/ tickEndSize = 6, tickPadding = 3, tickCentered = false, tickTextNum = 10, tickOffset = 0, categories = []; + var scale = d3.scale.linear(), orient = "bottom"; + var tickMajorSize = 6, /*tickMinorSize = 6,*/ tickEndSize = 6, tickPadding = 3, tickCentered = false, tickTextNum = 10, tickOffset = 0, tickFormat = null; + var categories = []; function axisX(selection, x) { selection.attr("transform", function (d) { return "translate(" + (x(d) + tickOffset) + ", 0)"; @@ -2100,6 +2102,10 @@ function category(i) { return i < categories.length ? categories[i] : i; } + function formattedCategory(i) { + var c = category(i); + return tickFormat ? tickFormat(c) : c; + } function axis(g) { g.each(function () { var g = d3.select(this); @@ -2135,7 +2141,7 @@ lineUpdate.attr("x1", tickX).attr("x2", tickX).attr("y2", tickMajorSize); textUpdate.attr("x", 0).attr("y", Math.max(tickMajorSize, 0) + tickPadding); text.attr("dy", ".71em").style("text-anchor", "middle"); - text.text(function (i) { return shouldShowTickText(ticks, i) ? category(i) : ""; }); + text.text(function (i) { return shouldShowTickText(ticks, i) ? formattedCategory(i) : ""; }); pathUpdate.attr("d", "M" + range[0] + "," + tickEndSize + "V0H" + range[1] + "V" + tickEndSize); } @@ -2161,7 +2167,7 @@ lineUpdate.attr("x2", -tickMajorSize).attr("y2", 0); textUpdate.attr("x", -(Math.max(tickMajorSize, 0) + tickPadding)).attr("y", tickOffset); text.attr("dy", ".32em").style("text-anchor", "end"); - text.text(function (i) { return shouldShowTickText(ticks, i) ? category(i) : ""; }); + text.text(function (i) { return shouldShowTickText(ticks, i) ? formattedCategory(i) : ""; }); pathUpdate.attr("d", "M" + -tickEndSize + "," + range[0] + "H0V" + range[1] + "H" + -tickEndSize); break; } @@ -2217,6 +2223,11 @@ tickTextNum = x; return axis; }; + axis.tickFormat = function (format) { + if (!arguments.length) { return tickFormat; } + tickFormat = format; + return axis; + }; axis.tickOffset = function () { return tickOffset; }; diff --git a/c3.min.js b/c3.min.js index c88992a..2e90c13 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,68 +1,68 @@ -(function(M){function wc(){function n(e,c){e.attr("transform",function(e){return"translate("+(c(e)+Z)+", 0)"})}function t(e,c){e.attr("transform",function(e){return"translate(0,"+c(e)+")"})}function M(e){var c=e[0];e=e[e.length-1];return ca?0:a}function ob(a){var b=Ia[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b= -a[0],d={},g=[],p,e;for(p=1;pw[d].indexOf(e.id)))for(g=0;g=h;h+=v)s+=e(a[c-1],a[c],h,u)}return s}function xb(a){var b,d;cb=e.select(va);if(cb.empty())M.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".'); -else{cb.html("");h.data.x=void 0;h.data.targets=Ja(a);Q();O();l.domain(e.extent(a.map(function(a){return a.x})));z.domain(ka("y"));S.domain(ka("y2"));ba.domain(l.domain());Va.domain(z.domain());Wa.domain(S.domain());I.ticks(10>a.length?a.length:10);na.ticks(Yc).outerTickSize(0).tickFormat(Zc);Xa.ticks($c).outerTickSize(0).tickFormat(ad);T=l.domain();E.x(ba);pa&&F.x(l);Ma=e.select(va).append("svg").attr("width",r+C+B).attr("height",q+v+aa).on("mouseenter",bd).on("mouseleave",cd);db=Ma.append("defs"); -db.append("clipPath").attr("id",yb).append("rect").attr("y",v).attr("width",r).attr("height",q-v);db.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-C).attr("y",-20).attr("width",Y).attr("height",hb);db.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-C+1).attr("y",v-1).attr("width",xc).attr("height",N);k=Ma.append("g").attr("transform",J.main);x=xa?Ma.append("g").attr("transform",J.context):null;ya=za?Ma.append("g").attr("transform",J.legend):null;W=e.select(va).style("position", -"relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",J.x).call(f?na:I).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(dd);k.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?I:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor", -"end").text(ed);Lb&&k.append("g").attr("class","y2 axis").attr("transform",J.y2).call(Xa);b=k.append("g").attr("clip-path",Na).attr("class","grid");mc&&b.append("g").attr("class","xgrids");zb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(zb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx", -f?0:-v).attr("dy",-6).text(function(a){return a.text}));fd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?r:-10).attr("y1",f?-10:v).attr("y2",f?-10:q);nc&&b.append("g").attr("class","ygrids");Ab&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Ab).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Na).attr("class","regions");k.append("g").attr("clip-path", -Na).attr("class","chart");k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",pa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ga&&qa?"pointer":null).on("mouseover",function(a,b){if(!eb){var d=h.data.targets.map(function(a){return ob(a.values[b])}),e,c;if(0",d,c,e;for(d=0;d"+e+""+ -c+"";return b+""}),id=c(["tooltip","init","show"],!1),Aa=c(["tooltip","init","x"],0),sc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),yb=va.replace("#","")+"-clip",Na="url(#"+yb+")",A="timeseries"===vc,ca="categorized"===vc,pb=!A&&U,Db=null,eb=!1,Cb=!1,la=za?40:0,oa=e.time.format(pd).parse,V=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===d.indexOf(b)&& -d.push(b);return c[d.indexOf(b)%c.length]}}(qd,rd),Ec=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"),function(a){return a.getSeconds()}],[e.time.format(".%L"), -function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Hb,Ob,Jb,Ua,Nb,Pb,r,q,ma,ib,ua,Rb,Sb,lb,mb,l,z,S,ba,Va,Wa,I,na,Xa,Da,zc=f?"left":"bottom",Ac=f?kb?"top":"bottom":kb?"right":"left",Bc=f?jb?"bottom":"top":jb?"left":"right",Cc="bottom",J={main:function(){return"translate("+C+","+v+")"},context:function(){return"translate("+G+","+Ba+")"},legend:function(){return"translate("+Gb+","+Fb+")"},y2:function(){return"translate("+(f? -0:r)+","+(f?10:0)+")"},x:function(){return"translate(0,"+q+")"},subx:function(){return"translate(0,"+ma+")"}},ld=function(){var a=e.svg.line().x(f?function(a){return y(a.id)(a.value)}:bb).y(f?bb:function(a){return y(a.id)(a.value)});return function(b){var d=lc(b.values),c;if(vb(b))return"spline"===fa["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return K};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b= -Za(function(b){return b.id===a});return 0a?0:a}function nb(a){var b=Ia[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b=a[0],d={},k=[],e,c;for(e=1;ew[d].indexOf(e.id)))for(k=0;k=g;g+=u)s+=e(a[c-1],a[c],g,v)}return s} +function wb(a){var b,d;db=e.select(ua);if(db.empty())O.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{db.html("");g.data.x=void 0;g.data.targets=Ja(a);sa();Eb();l.domain(e.extent(a.map(function(a){return a.x})));y.domain(ka("y"));T.domain(ka("y2"));ba.domain(l.domain());Wa.domain(y.domain());Xa.domain(T.domain());J.ticks(10>a.length?a.length:10);na.ticks(Yc).outerTickSize(0).tickFormat(Zc);Ya.ticks($c).outerTickSize(0).tickFormat(ad); +U=l.domain();F.x(ba);pa&&G.x(l);Ma=e.select(ua).append("svg").attr("width",r+A+aa).attr("height",u+p+E).on("mouseenter",bd).on("mouseleave",cd);eb=Ma.append("defs");eb.append("clipPath").attr("id",xb).append("rect").attr("y",p).attr("width",r).attr("height",u-p);eb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",Q).attr("height",P);eb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",p-1).attr("width",ja).attr("height", +hb);h=Ma.append("g").attr("transform",K.main);x=wa?Ma.append("g").attr("transform",K.context):null;xa=ya?Ma.append("g").attr("transform",K.legend):null;X=e.select(ua).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");h.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?na:J).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(dd); +h.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?J:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(ed);Mb&&h.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Ya);b=h.append("g").attr("clip-path",Na).attr("class","grid");mc&&b.append("g").attr("class","xgrids");yb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(yb).enter().append("g").attr("class", +"xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx",f?0:-p).attr("dy",-6).text(function(a){return a.text}));fd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?r:-10).attr("y1",f?-10:p).attr("y2",f?-10:u);nc&&b.append("g").attr("class","ygrids");zb&&b.append("g").attr("class", +"ygrid-lines").selectAll("ygrid-line").data(zb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});h.append("g").attr("clip-path",Na).attr("class","regions");h.append("g").attr("clip-path",Na).attr("class","chart");h.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",pa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ga&& +qa?"pointer":null).on("mouseover",function(a,b){if(!fb){var d=g.data.targets.map(function(a){return nb(a.values[b])}),e,c;if(0",d,c,e;for(d=0;d"+ +e+""+c+"";return b+""}),id=c(["tooltip","init","show"],!1),za=c(["tooltip","init","x"],0),sc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),xb=ua.replace("#","")+"-clip",Na="url(#"+xb+")",z="timeseries"===vc,ca="categorized"===vc,ob=!z&&V,Cb=null,fb=!1,Bb=!1,la=ya?40:0,oa=e.time.format(pd).parse,W=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in +a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(qd,rd),Ec=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"),function(a){return a.getSeconds()}], +[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Ib,Pb,Kb,Va,Ob,Qb,r,u,ma,ib,ta,Sb,Tb,lb,mb,l,y,T,ba,Wa,Xa,J,na,Ya,Da,zc=f?"left":"bottom",Ac=f?kb?"top":"bottom":kb?"right":"left",Bc=f?jb?"bottom":"top":jb?"left":"right",Cc="bottom",K={main:function(){return"translate("+A+","+p+")"},context:function(){return"translate("+m+","+Aa+")"},legend:function(){return"translate("+Gb+","+Fb+")"},y2:function(){return"translate("+ +(f?0:r)+","+(f?10:0)+")"},x:function(){return"translate(0,"+u+")"},subx:function(){return"translate(0,"+ma+")"}},ld=function(){var a=e.svg.line().x(f?function(a){return D(a.id)(a.value)}:cb).y(f?cb:function(a){return D(a.id)(a.value)});return function(b){var d=lc(b.values),c;if(ub(b))return"spline"===fa["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return L};g.data.get=function(a){a=g.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};g.data.getAsTarget=function(a){var b= +$a(function(b){return b.id===a});return 0 Date: Thu, 30 Jan 2014 18:45:02 +0900 Subject: [PATCH 12/31] Fix tick format bug --- c3.js | 2 +- c3.min.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/c3.js b/c3.js index e3621e9..acd2889 100644 --- a/c3.js +++ b/c3.js @@ -350,7 +350,7 @@ return id in __data_axes ? __data_axes[id] : 'y'; } function getXAxisTickFormat() { - var tickFormat = isTimeSeries ? defaultTimeFormat : isCategorized ? category : null; + var tickFormat = isTimeSeries ? defaultTimeFormat : isCategorized ? category : function (x) { return x; }; if (__axis_x_tick_format) { tickFormat = typeof __axis_x_tick_format === 'function' ? __axis_x_tick_format : isTimeSeries ? function (date) { return d3.time.format(__axis_x_tick_format)(date); } : tickFormat; } diff --git a/c3.min.js b/c3.min.js index 2e90c13..86a9e36 100644 --- a/c3.min.js +++ b/c3.min.js @@ -6,7 +6,7 @@ aa=e in{top:1,right:1,bottom:1,left:1}?e+"":"bottom";return m};m.categories=func O.c3={},e=O.d3;hb.generate=function(Y){var Fb,Gb,Aa,Ba,m,p,aa,E,A;function c(a,b){for(var d=Y,k=0;ka?0:a}function nb(a){var b=Ia[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b=a[0],d={},k=[],e,c;for(e=1;e Date: Thu, 30 Jan 2014 19:15:38 +0900 Subject: [PATCH 13/31] Fix line with regions --- c3.js | 8 ++-- c3.min.js | 122 +++++++++++++++++++++++++++--------------------------- 2 files changed, 65 insertions(+), 65 deletions(-) diff --git a/c3.js b/c3.js index acd2889..052a440 100644 --- a/c3.js +++ b/c3.js @@ -828,13 +828,13 @@ regions[i] = {}; if (isUndefined(_regions[i].start)) { regions[i].start = d[0].x; - } else if (isTimeSeries) { - regions[i].start = parseDate(_regions[i].start); + } else { + regions[i].start = isTimeSeries ? parseDate(_regions[i].start) : _regions[i].start; } if (isUndefined(_regions[i].end)) { regions[i].end = d[d.length - 1].x; - } else if (isTimeSeries) { - regions[i].end = parseDate(_regions[i].end); + } else { + regions[i].end = isTimeSeries ? parseDate(_regions[i].end) : _regions[i].end; } } } diff --git a/c3.min.js b/c3.min.js index 86a9e36..c9fa06a 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,68 +1,68 @@ -(function(O){function wc(){function n(e,c){e.attr("transform",function(e){return"translate("+(c(e)+Z)+", 0)"})}function t(e,c){e.attr("transform",function(e){return"translate(0,"+c(e)+")"})}function O(e){var c=e[0];e=e[e.length-1];return ca?0:a}function nb(a){var b=Ia[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b=a[0],d={},k=[],e,c;for(e=1;ea?0:a}function nb(a){var b=Ia[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b=a[0],c={},k=[],p,d;for(p=1;pw[d].indexOf(e.id)))for(k=0;k=g;g+=u)s+=e(a[c-1],a[c],g,v)}return s} -function wb(a){var b,d;db=e.select(ua);if(db.empty())O.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{db.html("");g.data.x=void 0;g.data.targets=Ja(a);sa();Eb();l.domain(e.extent(a.map(function(a){return a.x})));y.domain(ka("y"));T.domain(ka("y2"));ba.domain(l.domain());Wa.domain(y.domain());Xa.domain(T.domain());J.ticks(10>a.length?a.length:10);na.ticks(Yc).outerTickSize(0).tickFormat(Zc);Ya.ticks($c).outerTickSize(0).tickFormat(ad); -U=l.domain();F.x(ba);pa&&G.x(l);Ma=e.select(ua).append("svg").attr("width",r+A+aa).attr("height",u+p+E).on("mouseenter",bd).on("mouseleave",cd);eb=Ma.append("defs");eb.append("clipPath").attr("id",xb).append("rect").attr("y",p).attr("width",r).attr("height",u-p);eb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",Q).attr("height",P);eb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",p-1).attr("width",ja).attr("height", -hb);h=Ma.append("g").attr("transform",K.main);x=wa?Ma.append("g").attr("transform",K.context):null;xa=ya?Ma.append("g").attr("transform",K.legend):null;X=e.select(ua).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");h.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?na:J).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(dd); -h.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?J:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(ed);Mb&&h.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Ya);b=h.append("g").attr("clip-path",Na).attr("class","grid");mc&&b.append("g").attr("class","xgrids");yb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(yb).enter().append("g").attr("class", -"xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx",f?0:-p).attr("dy",-6).text(function(a){return a.text}));fd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?r:-10).attr("y1",f?-10:p).attr("y2",f?-10:u);nc&&b.append("g").attr("class","ygrids");zb&&b.append("g").attr("class", +function ea(a){return D(a.id)(a.value)}function Rc(){var a={},b=0,c,k;$a(Fa).forEach(function(d){for(c=0;cw[c].indexOf(d.id)))for(k=0;k=g;g+=u)s+=d(a[e-1],a[e],g,v)}return s} +function wb(a){var b,c;db=d.select(ua);if(db.empty())O.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{db.html("");g.data.x=void 0;g.data.targets=Ja(a);sa();Eb();l.domain(d.extent(a.map(function(a){return a.x})));y.domain(ka("y"));T.domain(ka("y2"));ba.domain(l.domain());Wa.domain(y.domain());Xa.domain(T.domain());J.ticks(10>a.length?a.length:10);na.ticks(Yc).outerTickSize(0).tickFormat(Zc);Ya.ticks($c).outerTickSize(0).tickFormat(ad); +U=l.domain();F.x(ba);pa&&G.x(l);Ma=d.select(ua).append("svg").attr("width",r+A+aa).attr("height",u+q+E).on("mouseenter",bd).on("mouseleave",cd);eb=Ma.append("defs");eb.append("clipPath").attr("id",xb).append("rect").attr("y",q).attr("width",r).attr("height",u-q);eb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",Q).attr("height",P);eb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",q-1).attr("width",ja).attr("height", +hb);h=Ma.append("g").attr("transform",K.main);x=wa?Ma.append("g").attr("transform",K.context):null;xa=ya?Ma.append("g").attr("transform",K.legend):null;X=d.select(ua).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");h.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?na:J).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(dd); +h.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?J:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(ed);Mb&&h.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Ya);b=h.append("g").attr("clip-path",Na).attr("class","grid");mc&&b.append("g").attr("class","xgrids");yb&&(c=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(yb).enter().append("g").attr("class", +"xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx",f?0:-q).attr("dy",-6).text(function(a){return a.text}));fd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?r:-10).attr("y1",f?-10:q).attr("y2",f?-10:u);nc&&b.append("g").attr("class","ygrids");zb&&b.append("g").attr("class", "ygrid-lines").selectAll("ygrid-line").data(zb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});h.append("g").attr("clip-path",Na).attr("class","regions");h.append("g").attr("clip-path",Na).attr("class","chart");h.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",pa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ga&& -qa?"pointer":null).on("mouseover",function(a,b){if(!fb){var d=g.data.targets.map(function(a){return nb(a.values[b])}),e,c;if(0",d,c,e;for(d=0;d"+ -e+""+c+"";return b+""}),id=c(["tooltip","init","show"],!1),za=c(["tooltip","init","x"],0),sc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),xb=ua.replace("#","")+"-clip",Na="url(#"+xb+")",z="timeseries"===vc,ca="categorized"===vc,ob=!z&&V,Cb=null,fb=!1,Bb=!1,la=ya?40:0,oa=e.time.format(pd).parse,W=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in -a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(qd,rd),Ec=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"),function(a){return a.getSeconds()}], -[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Ib,Pb,Kb,Va,Ob,Qb,r,u,ma,ib,ta,Sb,Tb,lb,mb,l,y,T,ba,Wa,Xa,J,na,Ya,Da,zc=f?"left":"bottom",Ac=f?kb?"top":"bottom":kb?"right":"left",Bc=f?jb?"bottom":"top":jb?"left":"right",Cc="bottom",K={main:function(){return"translate("+A+","+p+")"},context:function(){return"translate("+m+","+Aa+")"},legend:function(){return"translate("+Gb+","+Fb+")"},y2:function(){return"translate("+ -(f?0:r)+","+(f?10:0)+")"},x:function(){return"translate(0,"+u+")"},subx:function(){return"translate(0,"+ma+")"}},ld=function(){var a=e.svg.line().x(f?function(a){return D(a.id)(a.value)}:cb).y(f?cb:function(a){return D(a.id)(a.value)});return function(b){var d=lc(b.values),c;if(ub(b))return"spline"===fa["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return L};g.data.get=function(a){a=g.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};g.data.getAsTarget=function(a){var b= -$a(function(b){return b.id===a});return 0",c,d,e;for(c=0;c"+ +e+""+d+"";return b+""}),id=e(["tooltip","init","show"],!1),za=e(["tooltip","init","x"],0),sc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),xb=ua.replace("#","")+"-clip",Na="url(#"+xb+")",z="timeseries"===vc,ca="categorized"===vc,ob=!z&&V,Cb=null,fb=!1,Bb=!1,la=ya?40:0,oa=d.time.format(pd).parse,W=function(a,b){var c=[],d=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in +a)return a[b];-1===c.indexOf(b)&&c.push(b);return d[c.indexOf(b)%d.length]}}(qd,rd),Ec=function(){var a=[[d.time.format("%Y/%-m/%-d"),function(){return!0}],[d.time.format("%-m/%-d"),function(a){return a.getMonth()}],[d.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[d.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[d.time.format("%I %p"),function(a){return a.getHours()}],[d.time.format("%I:%M"),function(a){return a.getMinutes()}],[d.time.format(":%S"),function(a){return a.getSeconds()}], +[d.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,d=a[c];!d[1](b);)d=a[--c];return d[0](b)}}(),Ib,Pb,Kb,Va,Ob,Qb,r,u,ma,ib,ta,Sb,Tb,lb,mb,l,y,T,ba,Wa,Xa,J,na,Ya,Da,zc=f?"left":"bottom",Ac=f?kb?"top":"bottom":kb?"right":"left",Bc=f?jb?"bottom":"top":jb?"left":"right",Cc="bottom",K={main:function(){return"translate("+A+","+q+")"},context:function(){return"translate("+m+","+Aa+")"},legend:function(){return"translate("+Gb+","+Fb+")"},y2:function(){return"translate("+ +(f?0:r)+","+(f?10:0)+")"},x:function(){return"translate(0,"+u+")"},subx:function(){return"translate(0,"+ma+")"}},ld=function(){var a=d.svg.line().x(f?function(a){return D(a.id)(a.value)}:cb).y(f?cb:function(a){return D(a.id)(a.value)});return function(b){var c=lc(b.values),d;if(ub(b))return"spline"===fa["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0b.classes.indexOf(a)})});return L};g.data.get=function(a){a=g.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};g.data.getAsTarget=function(a){var b= +$a(function(b){return b.id===a});return 0 Date: Thu, 30 Jan 2014 19:24:27 +0900 Subject: [PATCH 14/31] Fix line with regions --- c3.js | 2 +- c3.min.js | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/c3.js b/c3.js index 052a440..818430c 100644 --- a/c3.js +++ b/c3.js @@ -795,7 +795,7 @@ var data = filterRemoveNull(d.values), x0, y0; if (isLineType(d)) { isSplineType(d) ? line.interpolate("cardinal") : line.interpolate("linear"); - return Object.keys(__data_regions).length > 0 ? lineWithRegions(data, x, getYScale(d.id), __data_regions[d.id]) : line(data); + return __data_regions[d.id] ? lineWithRegions(data, x, getYScale(d.id), __data_regions[d.id]) : line(data); } else { x0 = x(data[0].x); y0 = getYScale(d.id)(data[0].value); diff --git a/c3.min.js b/c3.min.js index c9fa06a..a9b4d3a 100644 --- a/c3.min.js +++ b/c3.min.js @@ -57,9 +57,9 @@ Oa=e(["axis","x","default"],null),dd=e(["axis","x","label"],null),Jc=e(["axis"," e+""+d+"";return b+""}),id=e(["tooltip","init","show"],!1),za=e(["tooltip","init","x"],0),sc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),xb=ua.replace("#","")+"-clip",Na="url(#"+xb+")",z="timeseries"===vc,ca="categorized"===vc,ob=!z&&V,Cb=null,fb=!1,Bb=!1,la=ya?40:0,oa=d.time.format(pd).parse,W=function(a,b){var c=[],d=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===c.indexOf(b)&&c.push(b);return d[c.indexOf(b)%d.length]}}(qd,rd),Ec=function(){var a=[[d.time.format("%Y/%-m/%-d"),function(){return!0}],[d.time.format("%-m/%-d"),function(a){return a.getMonth()}],[d.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[d.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[d.time.format("%I %p"),function(a){return a.getHours()}],[d.time.format("%I:%M"),function(a){return a.getMinutes()}],[d.time.format(":%S"),function(a){return a.getSeconds()}], [d.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,d=a[c];!d[1](b);)d=a[--c];return d[0](b)}}(),Ib,Pb,Kb,Va,Ob,Qb,r,u,ma,ib,ta,Sb,Tb,lb,mb,l,y,T,ba,Wa,Xa,J,na,Ya,Da,zc=f?"left":"bottom",Ac=f?kb?"top":"bottom":kb?"right":"left",Bc=f?jb?"bottom":"top":jb?"left":"right",Cc="bottom",K={main:function(){return"translate("+A+","+q+")"},context:function(){return"translate("+m+","+Aa+")"},legend:function(){return"translate("+Gb+","+Fb+")"},y2:function(){return"translate("+ -(f?0:r)+","+(f?10:0)+")"},x:function(){return"translate(0,"+u+")"},subx:function(){return"translate(0,"+ma+")"}},ld=function(){var a=d.svg.line().x(f?function(a){return D(a.id)(a.value)}:cb).y(f?cb:function(a){return D(a.id)(a.value)});return function(b){var c=lc(b.values),d;if(ub(b))return"spline"===fa["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),0 Date: Fri, 31 Jan 2014 12:30:34 +0900 Subject: [PATCH 15/31] Remove transition when y grid updated --- c3.js | 5 +---- c3.min.js | 8 ++++---- 2 files changed, 5 insertions(+), 8 deletions(-) diff --git a/c3.js b/c3.js index 818430c..d50d2e2 100644 --- a/c3.js +++ b/c3.js @@ -1471,10 +1471,7 @@ ygrid.attr("x1", __axis_rotated ? y : 0) .attr("x2", __axis_rotated ? y : width) .attr("y1", __axis_rotated ? 0 : y) - .attr("y2", __axis_rotated ? height : y) - .attr("opacity", 0) - .transition() - .attr("opacity", 1); + .attr("y2", __axis_rotated ? height : y); ygrid.exit().remove(); } if (withY && __grid_y_lines) { diff --git a/c3.min.js b/c3.min.js index a9b4d3a..3b2a14a 100644 --- a/c3.min.js +++ b/c3.min.js @@ -35,10 +35,10 @@ s=1*c.attr("width"),m=kc,h=f Date: Fri, 31 Jan 2014 12:42:05 +0900 Subject: [PATCH 16/31] Hide x grid on 0 --- c3.js | 3 +- c3.min.js | 129 +++++++++++++++++++++++++++--------------------------- 2 files changed, 67 insertions(+), 65 deletions(-) diff --git a/c3.js b/c3.js index d50d2e2..7eca9af 100644 --- a/c3.js +++ b/c3.js @@ -1449,7 +1449,8 @@ .attr("x1", function (d) { return x(d) - xAxis.tickOffset(); }) .attr("x2", function (d) { return x(d) - xAxis.tickOffset(); }) .attr("y1", margin.top) - .attr("y2", height); + .attr("y2", height) + .style("opacity", function () { return d3.select(this).attr('x1') === 0 ? 0 : 1; }); } if (__grid_x_lines) { xgridLine = main.selectAll(".xgrid-lines"); diff --git a/c3.min.js b/c3.min.js index 3b2a14a..b1a137d 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,68 +1,69 @@ -(function(O){function wc(){function n(d,e){d.attr("transform",function(d){return"translate("+(e(d)+Z)+", 0)"})}function t(d,e){d.attr("transform",function(d){return"translate(0,"+e(d)+")"})}function O(d){var e=d[0];d=d[d.length-1];return ea?0:a}function nb(a){var b=Ia[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b=a[0],c={},k=[],p,d;for(p=1;pa?0:a}function nb(a){var b=Ia[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b=a[0],d={},k=[],e,c;for(e=1;ew[c].indexOf(d.id)))for(k=0;k=g;g+=u)s+=d(a[e-1],a[e],g,v)}return s} -function wb(a){var b,c;db=d.select(ua);if(db.empty())O.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{db.html("");g.data.x=void 0;g.data.targets=Ja(a);sa();Eb();l.domain(d.extent(a.map(function(a){return a.x})));y.domain(ka("y"));T.domain(ka("y2"));ba.domain(l.domain());Wa.domain(y.domain());Xa.domain(T.domain());J.ticks(10>a.length?a.length:10);na.ticks(Yc).outerTickSize(0).tickFormat(Zc);Ya.ticks($c).outerTickSize(0).tickFormat(ad); -U=l.domain();F.x(ba);pa&&G.x(l);Ma=d.select(ua).append("svg").attr("width",r+A+aa).attr("height",u+q+E).on("mouseenter",bd).on("mouseleave",cd);eb=Ma.append("defs");eb.append("clipPath").attr("id",xb).append("rect").attr("y",q).attr("width",r).attr("height",u-q);eb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",Q).attr("height",P);eb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",q-1).attr("width",ja).attr("height", -hb);h=Ma.append("g").attr("transform",K.main);x=wa?Ma.append("g").attr("transform",K.context):null;xa=ya?Ma.append("g").attr("transform",K.legend):null;X=d.select(ua).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");h.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?na:J).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(dd); -h.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?J:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(ed);Mb&&h.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Ya);b=h.append("g").attr("clip-path",Na).attr("class","grid");mc&&b.append("g").attr("class","xgrids");yb&&(c=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(yb).enter().append("g").attr("class", -"xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx",f?0:-q).attr("dy",-6).text(function(a){return a.text}));fd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?r:-10).attr("y1",f?-10:q).attr("y2",f?-10:u);nc&&b.append("g").attr("class","ygrids");zb&&b.append("g").attr("class", +function ea(a){return D(a.id)(a.value)}function Rc(){var a={},b=0,d,k;$a(Fa).forEach(function(e){for(d=0;dw[d].indexOf(e.id)))for(k=0;k=g;g+=u)s+=e(a[c-1],a[c],g,v)}return s} +function wb(a){var b,d;db=e.select(ua);if(db.empty())O.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{db.html("");g.data.x=void 0;g.data.targets=Ja(a);sa();Eb();l.domain(e.extent(a.map(function(a){return a.x})));y.domain(ka("y"));T.domain(ka("y2"));ba.domain(l.domain());Wa.domain(y.domain());Xa.domain(T.domain());J.ticks(10>a.length?a.length:10);na.ticks(Yc).outerTickSize(0).tickFormat(Zc);Ya.ticks($c).outerTickSize(0).tickFormat(ad); +U=l.domain();F.x(ba);pa&&G.x(l);Ma=e.select(ua).append("svg").attr("width",r+A+aa).attr("height",u+p+E).on("mouseenter",bd).on("mouseleave",cd);eb=Ma.append("defs");eb.append("clipPath").attr("id",xb).append("rect").attr("y",p).attr("width",r).attr("height",u-p);eb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",Q).attr("height",P);eb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",p-1).attr("width",ja).attr("height", +hb);h=Ma.append("g").attr("transform",K.main);x=wa?Ma.append("g").attr("transform",K.context):null;xa=ya?Ma.append("g").attr("transform",K.legend):null;X=e.select(ua).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");h.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?na:J).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(dd); +h.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?J:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(ed);Mb&&h.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Ya);b=h.append("g").attr("clip-path",Na).attr("class","grid");mc&&b.append("g").attr("class","xgrids");yb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(yb).enter().append("g").attr("class", +"xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx",f?0:-p).attr("dy",-6).text(function(a){return a.text}));fd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?r:-10).attr("y1",f?-10:p).attr("y2",f?-10:u);nc&&b.append("g").attr("class","ygrids");zb&&b.append("g").attr("class", "ygrid-lines").selectAll("ygrid-line").data(zb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});h.append("g").attr("clip-path",Na).attr("class","regions");h.append("g").attr("clip-path",Na).attr("class","chart");h.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",pa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ga&& -qa?"pointer":null).on("mouseover",function(a,b){if(!fb){var c=g.data.targets.map(function(a){return nb(a.values[b])}),d,e;if(0",c,d,e;for(c=0;c"+ -e+""+d+"";return b+""}),id=e(["tooltip","init","show"],!1),za=e(["tooltip","init","x"],0),sc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),xb=ua.replace("#","")+"-clip",Na="url(#"+xb+")",z="timeseries"===vc,ca="categorized"===vc,ob=!z&&V,Cb=null,fb=!1,Bb=!1,la=ya?40:0,oa=d.time.format(pd).parse,W=function(a,b){var c=[],d=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in -a)return a[b];-1===c.indexOf(b)&&c.push(b);return d[c.indexOf(b)%d.length]}}(qd,rd),Ec=function(){var a=[[d.time.format("%Y/%-m/%-d"),function(){return!0}],[d.time.format("%-m/%-d"),function(a){return a.getMonth()}],[d.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[d.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[d.time.format("%I %p"),function(a){return a.getHours()}],[d.time.format("%I:%M"),function(a){return a.getMinutes()}],[d.time.format(":%S"),function(a){return a.getSeconds()}], -[d.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,d=a[c];!d[1](b);)d=a[--c];return d[0](b)}}(),Ib,Pb,Kb,Va,Ob,Qb,r,u,ma,ib,ta,Sb,Tb,lb,mb,l,y,T,ba,Wa,Xa,J,na,Ya,Da,zc=f?"left":"bottom",Ac=f?kb?"top":"bottom":kb?"right":"left",Bc=f?jb?"bottom":"top":jb?"left":"right",Cc="bottom",K={main:function(){return"translate("+A+","+q+")"},context:function(){return"translate("+m+","+Aa+")"},legend:function(){return"translate("+Gb+","+Fb+")"},y2:function(){return"translate("+ -(f?0:r)+","+(f?10:0)+")"},x:function(){return"translate(0,"+u+")"},subx:function(){return"translate(0,"+ma+")"}},ld=function(){var a=d.svg.line().x(f?function(a){return D(a.id)(a.value)}:cb).y(f?cb:function(a){return D(a.id)(a.value)});return function(b){var c=lc(b.values),d;if(ub(b))return"spline"===fa["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),uc[b.id]?Xc(c,l,D(b.id),uc[b.id]):a(c);d=l(c[0].x);b=D(b.id)(c[0].value);return f?"M "+b+" "+d:"M "+d+" "+b}}(),md=function(){var a= -d.svg.line().x(function(a){return ba(a.x)}).y(function(a){return R(a.id)(a.value)});return function(b){var c=lc(b.values);return ub(b)?a(c):"M "+ba(c[0].x)+" "+R(b.id)(c[0].value)}}(),F=d.svg.brush().on("brush",function(){B({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}),G=d.behavior.zoom().on("zoomstart",function(){G.altDomain=d.event.sourceEvent.altKey?l.orgDomain():null}).on("zoom",pa?nd:null);F.update=function(){x&&x.select(".x.brush").call(this);return this};G.orgScaleExtent= -function(){var a=tc?tc:[1,10];return[a[0],Math.max(va()/a[1],a[1])]};G.updateScaleExtent=function(){var a=l.orgDomain(),a=(a[1]-a[0])/(U[1]-U[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Ma,eb,h,x,xa,X,db,bb=null,pb=null,U;g.focus=function(a){g.defocus();d.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};g.defocus=function(a){d.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused", -!1).transition().duration(100).style("opacity",0.3)};g.revert=function(a){d.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};g.show=function(a){d.selectAll(Ra(a)).transition().style("opacity",1)};g.hide=function(a){d.selectAll(Ra(a)).transition().style("opacity",0)};g.unzoom=function(){F.clear().update();B({withUpdateXDomain:!0})};g.load=function(a){t(a.done)&&(a.done=function(){});"categories"in a&&ca&&(Ea=a.categories,J.categories(Ea)); -if("cacheIds"in a&&Sa(a.cacheIds))Pa(Ta(a.cacheIds),a.done);else if("data"in a)Pa(Ja(a.data),a.done);else if("url"in a)d.csv(a.url,function(b,c){Pa(Ja(c),a.done)});else if("rows"in a)Pa(Ja(Wb(a.rows)),a.done);else if("columns"in a)Pa(Ja(Xb(a.columns)),a.done);else throw Error("url or rows or columns is required.");};g.unload=function(a){g.data.targets=g.data.targets.filter(function(b){return b.id!==a});d.selectAll(".target-"+a).transition().style("opacity",0).remove();ya&&(d.selectAll(".legend-item-"+ -a).remove(),gb(g.data.targets));0b.classes.indexOf(a)})});return L};g.data.get=function(a){a=g.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};g.data.getAsTarget=function(a){var b= -$a(function(b){return b.id===a});return 0",d,c,e;for(d=0;d"+e+""+c+"";return b+""}),id=c(["tooltip","init","show"],!1),za=c(["tooltip","init","x"],0),sc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),xb=ua.replace("#","")+"-clip",Na="url(#"+xb+")",z="timeseries"===vc,ca="categorized"===vc,ob=!z&&V,Cb=null,fb=!1,Bb=!1,la=ya?40: +0,oa=e.time.format(pd).parse,W=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(qd,rd),Ec=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&& +1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"),function(a){return a.getSeconds()}],[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Ib,Pb,Kb,Va,Ob,Qb,r,u,ma,ib,ta,Sb,Tb,lb,mb,l,y,T,ba,Wa,Xa,J,na,Ya,Da,zc=f?"left":"bottom",Ac=f?kb?"top":"bottom":kb?"right":"left",Bc=f?jb?"bottom":"top":jb?"left": +"right",Cc="bottom",K={main:function(){return"translate("+A+","+p+")"},context:function(){return"translate("+m+","+Aa+")"},legend:function(){return"translate("+Gb+","+Fb+")"},y2:function(){return"translate("+(f?0:r)+","+(f?10:0)+")"},x:function(){return"translate(0,"+u+")"},subx:function(){return"translate(0,"+ma+")"}},ld=function(){var a=e.svg.line().x(f?function(a){return D(a.id)(a.value)}:cb).y(f?cb:function(a){return D(a.id)(a.value)});return function(b){var d=lc(b.values),c;if(ub(b))return"spline"=== +fa["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),uc[b.id]?Xc(d,l,D(b.id),uc[b.id]):a(d);c=l(d[0].x);b=D(b.id)(d[0].value);return f?"M "+b+" "+c:"M "+c+" "+b}}(),md=function(){var a=e.svg.line().x(function(a){return ba(a.x)}).y(function(a){return R(a.id)(a.value)});return function(b){var d=lc(b.values);return ub(b)?a(d):"M "+ba(d[0].x)+" "+R(b.id)(d[0].value)}}(),F=e.svg.brush().on("brush",function(){B({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}), +G=e.behavior.zoom().on("zoomstart",function(){G.altDomain=e.event.sourceEvent.altKey?l.orgDomain():null}).on("zoom",pa?nd:null);F.update=function(){x&&x.select(".x.brush").call(this);return this};G.orgScaleExtent=function(){var a=tc?tc:[1,10];return[a[0],Math.max(va()/a[1],a[1])]};G.updateScaleExtent=function(){var a=l.orgDomain(),a=(a[1]-a[0])/(U[1]-U[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Ma,eb,h,x,xa,X,db,bb=null,pb=null,U;g.focus=function(a){g.defocus(); +e.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};g.defocus=function(a){e.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",0.3)};g.revert=function(a){e.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};g.show=function(a){e.selectAll(Ra(a)).transition().style("opacity",1)};g.hide=function(a){e.selectAll(Ra(a)).transition().style("opacity", +0)};g.unzoom=function(){F.clear().update();B({withUpdateXDomain:!0})};g.load=function(a){t(a.done)&&(a.done=function(){});"categories"in a&&ca&&(Ea=a.categories,J.categories(Ea));if("cacheIds"in a&&Sa(a.cacheIds))Pa(Ta(a.cacheIds),a.done);else if("data"in a)Pa(Ja(a.data),a.done);else if("url"in a)e.csv(a.url,function(b,d){Pa(Ja(d),a.done)});else if("rows"in a)Pa(Ja(Wb(a.rows)),a.done);else if("columns"in a)Pa(Ja(Xb(a.columns)),a.done);else throw Error("url or rows or columns is required.");};g.unload= +function(a){g.data.targets=g.data.targets.filter(function(b){return b.id!==a});e.selectAll(".target-"+a).transition().style("opacity",0).remove();ya&&(e.selectAll(".legend-item-"+a).remove(),gb(g.data.targets));0b.classes.indexOf(a)})});return L}; +g.data.get=function(a){a=g.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};g.data.getAsTarget=function(a){var b=$a(function(b){return b.id===a});return 0 Date: Fri, 31 Jan 2014 12:54:29 +0900 Subject: [PATCH 17/31] Fix x grid when rotated --- c3.js | 11 +++-- c3.min.js | 122 +++++++++++++++++++++++++++--------------------------- 2 files changed, 66 insertions(+), 67 deletions(-) diff --git a/c3.js b/c3.js index 7eca9af..6955ab9 100644 --- a/c3.js +++ b/c3.js @@ -1444,13 +1444,12 @@ xgrid = main.select('.xgrids').selectAll(".xgrid") .data(xgridData); xgrid.enter().append('line').attr("class", "xgrid"); + xgrid.attr("x1", __axis_rotated ? 0 : function (d) { return x(d) - xAxis.tickOffset(); }) + .attr("x2", __axis_rotated ? width : function (d) { return x(d) - xAxis.tickOffset(); }) + .attr("y1", __axis_rotated ? function (d) { return x(d) - xAxis.tickOffset(); } : margin.top) + .attr("y2", __axis_rotated ? function (d) { return x(d) - xAxis.tickOffset(); } : height) + .style("opacity", function () { return +d3.select(this).attr(__axis_rotated ? 'y1' : 'x1') === (__axis_rotated ? height : 0) ? 0 : 1; }); xgrid.exit().remove(); - main.selectAll(".xgrid") - .attr("x1", function (d) { return x(d) - xAxis.tickOffset(); }) - .attr("x2", function (d) { return x(d) - xAxis.tickOffset(); }) - .attr("y1", margin.top) - .attr("y2", height) - .style("opacity", function () { return d3.select(this).attr('x1') === 0 ? 0 : 1; }); } if (__grid_x_lines) { xgridLine = main.selectAll(".xgrid-lines"); diff --git a/c3.min.js b/c3.min.js index b1a137d..1a08aaf 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,69 +1,69 @@ -(function(O){function wc(){function n(e,c){e.attr("transform",function(e){return"translate("+(c(e)+Z)+", 0)"})}function t(e,c){e.attr("transform",function(e){return"translate(0,"+c(e)+")"})}function O(e){var c=e[0];e=e[e.length-1];return ca?0:a}function nb(a){var b=Ia[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b=a[0],d={},k=[],e,c;for(e=1;ew[d].indexOf(e.id)))for(k=0;k=g;g+=u)s+=e(a[c-1],a[c],g,v)}return s} -function wb(a){var b,d;db=e.select(ua);if(db.empty())O.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{db.html("");g.data.x=void 0;g.data.targets=Ja(a);sa();Eb();l.domain(e.extent(a.map(function(a){return a.x})));y.domain(ka("y"));T.domain(ka("y2"));ba.domain(l.domain());Wa.domain(y.domain());Xa.domain(T.domain());J.ticks(10>a.length?a.length:10);na.ticks(Yc).outerTickSize(0).tickFormat(Zc);Ya.ticks($c).outerTickSize(0).tickFormat(ad); -U=l.domain();F.x(ba);pa&&G.x(l);Ma=e.select(ua).append("svg").attr("width",r+A+aa).attr("height",u+p+E).on("mouseenter",bd).on("mouseleave",cd);eb=Ma.append("defs");eb.append("clipPath").attr("id",xb).append("rect").attr("y",p).attr("width",r).attr("height",u-p);eb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",Q).attr("height",P);eb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",p-1).attr("width",ja).attr("height", -hb);h=Ma.append("g").attr("transform",K.main);x=wa?Ma.append("g").attr("transform",K.context):null;xa=ya?Ma.append("g").attr("transform",K.legend):null;X=e.select(ua).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");h.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?na:J).append("text").attr("class","-axis-x-label").attr("x",r).attr("dy","-.5em").style("text-anchor","end").text(dd); -h.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?J:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(ed);Mb&&h.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Ya);b=h.append("g").attr("clip-path",Na).attr("class","grid");mc&&b.append("g").attr("class","xgrids");yb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(yb).enter().append("g").attr("class", -"xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx",f?0:-p).attr("dy",-6).text(function(a){return a.text}));fd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?r:-10).attr("y1",f?-10:p).attr("y2",f?-10:u);nc&&b.append("g").attr("class","ygrids");zb&&b.append("g").attr("class", +(function(O){function xc(){function n(e,c){e.attr("transform",function(e){return"translate("+(c(e)+Z)+", 0)"})}function r(e,c){e.attr("transform",function(e){return"translate(0,"+c(e)+")"})}function O(e){var c=e[0];e=e[e.length-1];return ca?0:a}function nb(a){var b=Ia[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b=a[0],d={},k=[],e,c;for(e=1;ew[d].indexOf(e.id)))for(k=0;k=g;g+=s)u+=e(a[c-1],a[c],g,v)}return u} +function wb(a){var b,d;db=e.select(ua);if(db.empty())O.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{db.html("");g.data.x=void 0;g.data.targets=Ja(a);sa();Eb();l.domain(e.extent(a.map(function(a){return a.x})));y.domain(ka("y"));T.domain(ka("y2"));ba.domain(l.domain());Wa.domain(y.domain());Xa.domain(T.domain());B.ticks(10>a.length?a.length:10);na.ticks(Zc).outerTickSize(0).tickFormat($c);Ya.ticks(ad).outerTickSize(0).tickFormat(bd); +U=l.domain();G.x(ba);pa&&H.x(l);Ma=e.select(ua).append("svg").attr("width",p+A+aa).attr("height",t+s+F).on("mouseenter",cd).on("mouseleave",dd);eb=Ma.append("defs");eb.append("clipPath").attr("id",xb).append("rect").attr("y",s).attr("width",p).attr("height",t-s);eb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",Q).attr("height",P);eb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",s-1).attr("width",ja).attr("height", +hb);h=Ma.append("g").attr("transform",K.main);x=wa?Ma.append("g").attr("transform",K.context):null;xa=ya?Ma.append("g").attr("transform",K.legend):null;X=e.select(ua).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");h.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?na:B).append("text").attr("class","-axis-x-label").attr("x",p).attr("dy","-.5em").style("text-anchor","end").text(ed); +h.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?B:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(fd);Mb&&h.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Ya);b=h.append("g").attr("clip-path",Na).attr("class","grid");nc&&b.append("g").attr("class","xgrids");yb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(yb).enter().append("g").attr("class", +"xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx",f?0:-s).attr("dy",-6).text(function(a){return a.text}));gd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?p:-10).attr("y1",f?-10:s).attr("y2",f?-10:t);oc&&b.append("g").attr("class","ygrids");zb&&b.append("g").attr("class", "ygrid-lines").selectAll("ygrid-line").data(zb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});h.append("g").attr("clip-path",Na).attr("class","regions");h.append("g").attr("clip-path",Na).attr("class","chart");h.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",pa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ga&& -qa?"pointer":null).on("mouseover",function(a,b){if(!fb){var d=g.data.targets.map(function(a){return nb(a.values[b])}),e,c;if(0",d,c,e;for(d=0;d"+e+""+c+"";return b+""}),id=c(["tooltip","init","show"],!1),za=c(["tooltip","init","x"],0),sc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),xb=ua.replace("#","")+"-clip",Na="url(#"+xb+")",z="timeseries"===vc,ca="categorized"===vc,ob=!z&&V,Cb=null,fb=!1,Bb=!1,la=ya?40: -0,oa=e.time.format(pd).parse,W=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(qd,rd),Ec=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&& -1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"),function(a){return a.getSeconds()}],[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Ib,Pb,Kb,Va,Ob,Qb,r,u,ma,ib,ta,Sb,Tb,lb,mb,l,y,T,ba,Wa,Xa,J,na,Ya,Da,zc=f?"left":"bottom",Ac=f?kb?"top":"bottom":kb?"right":"left",Bc=f?jb?"bottom":"top":jb?"left": -"right",Cc="bottom",K={main:function(){return"translate("+A+","+p+")"},context:function(){return"translate("+m+","+Aa+")"},legend:function(){return"translate("+Gb+","+Fb+")"},y2:function(){return"translate("+(f?0:r)+","+(f?10:0)+")"},x:function(){return"translate(0,"+u+")"},subx:function(){return"translate(0,"+ma+")"}},ld=function(){var a=e.svg.line().x(f?function(a){return D(a.id)(a.value)}:cb).y(f?cb:function(a){return D(a.id)(a.value)});return function(b){var d=lc(b.values),c;if(ub(b))return"spline"=== -fa["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),uc[b.id]?Xc(d,l,D(b.id),uc[b.id]):a(d);c=l(d[0].x);b=D(b.id)(d[0].value);return f?"M "+b+" "+c:"M "+c+" "+b}}(),md=function(){var a=e.svg.line().x(function(a){return ba(a.x)}).y(function(a){return R(a.id)(a.value)});return function(b){var d=lc(b.values);return ub(b)?a(d):"M "+ba(d[0].x)+" "+R(b.id)(d[0].value)}}(),F=e.svg.brush().on("brush",function(){B({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}), -G=e.behavior.zoom().on("zoomstart",function(){G.altDomain=e.event.sourceEvent.altKey?l.orgDomain():null}).on("zoom",pa?nd:null);F.update=function(){x&&x.select(".x.brush").call(this);return this};G.orgScaleExtent=function(){var a=tc?tc:[1,10];return[a[0],Math.max(va()/a[1],a[1])]};G.updateScaleExtent=function(){var a=l.orgDomain(),a=(a[1]-a[0])/(U[1]-U[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Ma,eb,h,x,xa,X,db,bb=null,pb=null,U;g.focus=function(a){g.defocus(); +{data:{}},ab={},ha="_expanded_",ia="_selected_",Db="_included_",ua=c(["bindto"],"#chart"),Ua=c(["size","width"],null),Rb=c(["size","height"],null),Nb=c(["padding","left"],null),Lb=c(["padding","right"],null),pa=c(["zoom","enabled"],!1),uc=c(["zoom","extent"],null),id=c(["zoom","privileged"],!1),cd=c(["onenter"],function(){}),dd=c(["onleave"],function(){});if(!("data"in Y))throw Error("data is required in config");var V=c(["data","x"],void 0),qd=c(["data","x_format"],"%Y-%m-%d"),Oc=c(["data","id_converter"], +function(a){return a}),Ia=c(["data","names"],{}),w=c(["data","groups"],[]),Ub=c(["data","axes"],{}),fa=c(["data","types"],{}),vc=c(["data","regions"],{}),rd=c(["data","colors"],{}),ga=c(["data","selection","enabled"],!1),qa=c(["data","selection","grouped"],!1),ra=c(["data","selection","isselectable"],function(){return!0}),wa=c(["subchart","show"],!1),Jb=wa?c(["subchart","size","height"],60):0,sd=c(["color","pattern"],null),ya=c(["legend","show"],!0),Qa=c(["legend","item","width"],80),pd=c(["legend", +"item","onclick"],function(){}),wc=c(["axis","x","type"],"indexed"),Ea=c(["axis","x","categories"],[]),Ec=c(["axis","x","tick","centered"],!1),Za=c(["axis","x","tick","format"],null),Oa=c(["axis","x","default"],null),ed=c(["axis","x","label"],null),Kc=c(["axis","y","max"],null),Ic=c(["axis","y","min"],null),Mc=c(["axis","y","center"],null),fd=c(["axis","y","label"],null),kb=c(["axis","y","inner"],!1),$c=c(["axis","y","format"],function(a){return a}),Ga=c(["axis","y","padding"],null),Zc=c(["axis", +"y","ticks"],10),Mb=c(["axis","y2","show"],!1),Jc=c(["axis","y2","max"],null),Hc=c(["axis","y2","min"],null),Lc=c(["axis","y2","center"],null),jb=c(["axis","y2","inner"],!1),bd=c(["axis","y2","format"],function(a){return a}),Ha=c(["axis","y2","padding"],null),ad=c(["axis","y2","ticks"],10),f=c(["axis","rotated"],!1),nc=c(["grid","x","show"],!1),ld=c(["grid","x","type"],"tick"),yb=c(["grid","x","lines"],null),oc=c(["grid","y","show"],!1),zb=c(["grid","y","lines"],null),Ab=c(["point","show"],!0)?c(["point", +"r"],2.5):0,gd=c(["point","focus","line","enabled"],!0),pc=c(["point","focus","expand","enabled"],!0),qc=c(["point","focus","expand","r"],pc?4:Ab),La=c(["point","focus","select","r"],8),hd=c(["point","onclick"],function(){}),Vc=c(["point","onselected"],function(){}),Wc=c(["point","onunselected"],function(){}),L=c(["regions"],[]),rc=c(["tooltip","contents"],function(a){var b="",d,c,e;for(d=0;d";return b+"
"+J()(a[0].x)+"
"+e+""+c+"
"}),jd=c(["tooltip","init","show"],!1),za=c(["tooltip","init","x"],0),tc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),xb=ua.replace("#","")+"-clip",Na="url(#"+xb+")",z="timeseries"===wc,ca="categorized"===wc,ob=!z&&V,Cb=null,fb=!1,Bb=!1,la=ya?40: +0,oa=e.time.format(qd).parse,W=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(rd,sd),Fc=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&& +1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"),function(a){return a.getSeconds()}],[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Ib,Pb,Kb,Va,Ob,Qb,p,t,ma,ib,ta,Sb,Tb,lb,mb,l,y,T,ba,Wa,Xa,B,na,Ya,Da,Ac=f?"left":"bottom",Bc=f?kb?"top":"bottom":kb?"right":"left",Cc=f?jb?"bottom":"top":jb?"left": +"right",Dc="bottom",K={main:function(){return"translate("+A+","+s+")"},context:function(){return"translate("+m+","+Aa+")"},legend:function(){return"translate("+Gb+","+Fb+")"},y2:function(){return"translate("+(f?0:p)+","+(f?10:0)+")"},x:function(){return"translate(0,"+t+")"},subx:function(){return"translate(0,"+ma+")"}},md=function(){var a=e.svg.line().x(f?function(a){return E(a.id)(a.value)}:cb).y(f?cb:function(a){return E(a.id)(a.value)});return function(b){var d=lc(b.values),c;if(ub(b))return"spline"=== +fa["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),vc[b.id]?Yc(d,l,E(b.id),vc[b.id]):a(d);c=l(d[0].x);b=E(b.id)(d[0].value);return f?"M "+b+" "+c:"M "+c+" "+b}}(),nd=function(){var a=e.svg.line().x(function(a){return ba(a.x)}).y(function(a){return R(a.id)(a.value)});return function(b){var d=lc(b.values);return ub(b)?a(d):"M "+ba(d[0].x)+" "+R(b.id)(d[0].value)}}(),G=e.svg.brush().on("brush",function(){C({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}), +H=e.behavior.zoom().on("zoomstart",function(){H.altDomain=e.event.sourceEvent.altKey?l.orgDomain():null}).on("zoom",pa?od:null);G.update=function(){x&&x.select(".x.brush").call(this);return this};H.orgScaleExtent=function(){var a=uc?uc:[1,10];return[a[0],Math.max(va()/a[1],a[1])]};H.updateScaleExtent=function(){var a=l.orgDomain(),a=(a[1]-a[0])/(U[1]-U[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Ma,eb,h,x,xa,X,db,bb=null,pb=null,U;g.focus=function(a){g.defocus(); e.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};g.defocus=function(a){e.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",0.3)};g.revert=function(a){e.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};g.show=function(a){e.selectAll(Ra(a)).transition().style("opacity",1)};g.hide=function(a){e.selectAll(Ra(a)).transition().style("opacity", -0)};g.unzoom=function(){F.clear().update();B({withUpdateXDomain:!0})};g.load=function(a){t(a.done)&&(a.done=function(){});"categories"in a&&ca&&(Ea=a.categories,J.categories(Ea));if("cacheIds"in a&&Sa(a.cacheIds))Pa(Ta(a.cacheIds),a.done);else if("data"in a)Pa(Ja(a.data),a.done);else if("url"in a)e.csv(a.url,function(b,d){Pa(Ja(d),a.done)});else if("rows"in a)Pa(Ja(Wb(a.rows)),a.done);else if("columns"in a)Pa(Ja(Xb(a.columns)),a.done);else throw Error("url or rows or columns is required.");};g.unload= -function(a){g.data.targets=g.data.targets.filter(function(b){return b.id!==a});e.selectAll(".target-"+a).transition().style("opacity",0).remove();ya&&(e.selectAll(".legend-item-"+a).remove(),gb(g.data.targets));0b.classes.indexOf(a)})});return L}; +0)};g.unzoom=function(){G.clear().update();C({withUpdateXDomain:!0})};g.load=function(a){r(a.done)&&(a.done=function(){});"categories"in a&&ca&&(Ea=a.categories,B.categories(Ea));if("cacheIds"in a&&Sa(a.cacheIds))Pa(Ta(a.cacheIds),a.done);else if("data"in a)Pa(Ja(a.data),a.done);else if("url"in a)e.csv(a.url,function(b,d){Pa(Ja(d),a.done)});else if("rows"in a)Pa(Ja(Wb(a.rows)),a.done);else if("columns"in a)Pa(Ja(Xb(a.columns)),a.done);else throw Error("url or rows or columns is required.");};g.unload= +function(a){g.data.targets=g.data.targets.filter(function(b){return b.id!==a});e.selectAll(".target-"+a).transition().style("opacity",0).remove();ya&&(e.selectAll(".legend-item-"+a).remove(),gb(g.data.targets));0b.classes.indexOf(a)})});return L}; g.data.get=function(a){a=g.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};g.data.getAsTarget=function(a){var b=$a(function(b){return b.id===a});return 0 Date: Mon, 3 Feb 2014 18:21:14 +0900 Subject: [PATCH 18/31] Support multiple xs --- c3.js | 663 ++++++++++++++++++++++++++++++++++-------------------- c3.min.js | 141 ++++++------ 2 files changed, 487 insertions(+), 317 deletions(-) diff --git a/c3.js b/c3.js index 6955ab9..2cc64a3 100644 --- a/c3.js +++ b/c3.js @@ -48,7 +48,8 @@ // data - data configuration checkConfig('data', 'data is required in config'); - var __data_x = getConfig(['data', 'x'], undefined), + var __data_x = getConfig(['data', 'x'], null), + __data_xs = getConfig(['data', 'xs'], null), __data_x_format = getConfig(['data', 'x_format'], '%Y-%m-%d'), __data_id_converter = getConfig(['data', 'id_converter'], function (id) { return id; }), __data_names = getConfig(['data', 'names'], {}), @@ -153,14 +154,12 @@ var isTimeSeries = (__axis_x_type === 'timeseries'), isCategorized = (__axis_x_type === 'categorized'), - isCustomX = !isTimeSeries && __data_x; + isCustomX = !isTimeSeries && (__data_x || __data_xs); var dragStart = null, dragging = false, cancelClick = false; var legendHeight = __legend_show ? 40 : 0; - var parseDate = d3.time.format(__data_x_format).parse; - var color = generateColor(__data_colors, __color_pattern); var defaultTimeFormat = (function () { @@ -458,6 +457,16 @@ //-- Data --// + function isX(key) { + return (__data_x && key === __data_x) || (__data_xs && hasValue(__data_xs, key)); + } + function isNotX(key) { + return !isX(key); + } + function getXKey(id) { + return __data_x ? __data_x : __data_xs ? __data_xs[id] : null; + } + function addName(data) { var name = __data_names[data.id]; data.name = isDefined(name) ? name : data.id; @@ -489,45 +498,49 @@ return new_rows; } function convertDataToTargets(data) { - var ids = d3.keys(data[0]).filter(function (key) { return key !== __data_x; }); - var targets, index, parsedDate; + var ids = d3.keys(data[0]).filter(isNotX), xs = d3.keys(data[0]).filter(isX), targets; - // check __data_x is defined if timeseries - if (isTimeSeries && ! __data_x) { - window.alert('data.x must be specified when axis.x.type == "timeseries"'); + // check "x" is defined if timeseries + if (isTimeSeries && xs.length === 0) { + window.alert('data.x or data.xs must be specified when axis.x.type == "timeseries"'); return []; } - if (isCustomX && isUndefined(c3.data.x)) { - c3.data.x = data.map(function (d) { return d[__data_x]; }); + // save x for update data by load + if (isCustomX) { + ids.forEach(function (id) { + var xKey = getXKey(id); + if (xs.indexOf(xKey) >= 0) { + c3.data.x[id] = data.map(function (d) { return d[xKey]; }); + } + }); } - index = 0; - data.forEach(function (d) { - if (isTimeSeries) { - if (!(__data_x in d)) { throw Error("'" + __data_x + "' must be included in data"); } - parsedDate = parseDate(d[__data_x]); - if (parsedDate === null) { throw Error("Failed to parse timeseries date in data"); } - d.x = parsedDate; - } - else if (isCustomX) { - d.x = isDefined(d[__data_x]) ? d[__data_x] : c3.data.x[index]; - } - else { - d.x = index; - } - if (firstDate === null) { firstDate = new Date(d.x); } - lastDate = new Date(d.x); - index++; - }); - + // convert to target targets = ids.map(function (id) { var convertedId = __data_id_converter(id); return { id: convertedId, id_org: id, - values: data.map(function (d) { - return {x: d.x, value: d[id] !== null && !isNaN(d[id]) ? +d[id] : null, id: convertedId}; + values: data.map(function (d, i) { + var x, xKey = getXKey(id); + + if (isTimeSeries) { + x = parseDate(d[xKey]); + } + else if (isCustomX) { + x = d[xKey] ? d[xKey] : c3.data.x[id][i]; + } + else { + x = i; + } + + if (x < firstX || firstX === null) { firstX = x; } + if (lastX < x) { lastX = x; } + + d.x = x; // used by event-rect + + return {x: x, value: d[id] !== null && !isNaN(d[id]) ? +d[id] : null, id: convertedId, index: i}; }) }; }); @@ -595,10 +608,84 @@ return y(d.value); } - //-- Circle --/ + function findClosestOfValues(values, pos, _min, _max) { // MEMO: values must be sorted by x + var min = _min ? _min : 0, + max = _max ? _max : values.length - 1, + med = Math.floor((max - min) / 2) + min, + value = values[med], + diff = x(value.x) - pos[0], + minDist, maxDist; + + // Update rage for search + diff > 0 ? max = med : min = med; + + // if candidates are two closest min and max, stop recursive call + if ((max - min) === 1) { + if (! values[min].x) { return values[max]; } + if (! values[max].x) { return values[min]; } + minDist = Math.pow(pos[0] - x(values[min].x), 2) + Math.pow(pos[1] - y(values[min].value), 2); + maxDist = Math.pow(pos[0] - x(values[max].x), 2) + Math.pow(pos[1] - y(values[max].value), 2); + return minDist < maxDist ? values[min] : values[max]; + } + + return findClosestOfValues(values, pos, min, max); + } + function findClosest(targets, mouse) { + var closest, closests, minDist; + + // map to array of closest points of each target + closests = targets.map(function (target) { + return findClosestOfValues(target.values, mouse); + }); + + // decide closest point + closests.forEach(function (c) { + var dist = Math.pow(x(c.x) - mouse[0], 2) + Math.pow(y(c.value) - mouse[1], 2); + if (dist < minDist || ! minDist) { + minDist = dist; + closest = c; + } + }); + + // TODO: multiple closests when each is very close + + return closest; + } + + //-- Tooltip --// + + function showTooltip(selectedData, mouse) { + // Construct tooltip + tooltip.html(__tooltip_contents(selectedData)) + .style("visibility", "hidden") + .style("display", "block"); + // Get tooltip dimensions + var tWidth = tooltip.property('offsetWidth'), + tHeight = tooltip.property('offsetHeight'); + // Set tooltip + // todo get rid of magic numbers + tooltip + .style("top", (mouse[1] + 15 + tHeight < getCurrentHeight() ? mouse[1] + 15 : mouse[1] - tHeight) + "px") + .style("left", ((__axis_rotated ? + mouse[0] : + (x(selectedData[0].x) + 60 + tWidth < getCurrentWidth()) ? + (x(selectedData[0].x) + 60) + "px" : (x(selectedData[0].x) - tWidth + 30) + "px" + ))) + .style("visibility", "visible"); + } + + function showXGridFocus(data) { + main.selectAll('line.xgrid-focus') + .style("visibility", "visible") + .data([data]) + .attr(__axis_rotated ? 'y1' : 'x1', xx) + .attr(__axis_rotated ? 'y2' : 'x2', xx); + } + + //-- Circle --// function circleX(d) { - return x(d.x); + return d.x || d.x === 0 ? x(d.x) : null; } function circleY(d) { return getYScale(d.id)(d.value); @@ -724,6 +811,16 @@ }; } + //-- Date --// + + function parseDate(date) { + var parsedDate; + if (!date) { throw Error(date + " can not be parsed as d3.time with format " + __data_x_format + ". Maybe 'x' of this data is not defined. See data.x or data.xs option."); } + parsedDate = d3.time.format(__data_x_format).parse(date); + if (!parsedDate) { throw Error("Failed to parse '" + date + "' with format " + __data_x_format); } + return parsedDate; + } + //-- Util --// function isWithinCircle(_this, _r) { @@ -745,6 +842,18 @@ return false; } + function hasValue(dict, value) { + var found = false; + Object.keys(dict).forEach(function (key) { + if (dict[key] === value) { found = true; } + }); + return found; + } + + function dist(data, mouse) { + return Math.pow(x(data.x) - mouse[0], 2) + Math.pow(y(data.value) - mouse[1], 2); + } + //-- Selection --// function selectPoint(target, d, i) { @@ -910,10 +1019,10 @@ var svg, defs, main, context, legend, tooltip, selectChart; // for brush area culculation - var firstDate = null, lastDate = null, orgXDomain; + var firstX = null, lastX = null, orgXDomain; function init(data) { - var grid, xgridLine; + var eventRect, grid, xgridLine; var i; selectChart = d3.select(__bindto); @@ -924,7 +1033,7 @@ selectChart.html(""); } - c3.data.x = undefined; + c3.data.x = {}; c3.data.targets = convertDataToTargets(data); // TODO: set names if names not specified @@ -934,7 +1043,7 @@ updateScales(); // Set domains for each scale - x.domain(d3.extent(data.map(function (d) { return d.x; }))); + x.domain(d3.extent([firstX, lastX])); y.domain(getYDomain('y')); y2.domain(getYDomain('y2')); subX.domain(x.domain()); @@ -1091,10 +1200,105 @@ .attr('class', 'chart'); // Cover whole with rects for events - main.select('.chart').append("g") + eventRect = main.select('.chart').append("g") .attr("class", "event-rects") .style('fill-opacity', 0) - .style('cursor', __zoom_enabled ? 'ew-resize' : null) + .style('cursor', __zoom_enabled ? 'ew-resize' : null); + + // Generate rect for event handling + __data_xs ? generateEventRectsForMultipleXs(eventRect) : generateEventRectsForSingleX(eventRect, data); + + // Define g for bar chart area + main.select(".chart").append("g") + .attr("class", "chart-bars"); + + // Define g for line chart area + main.select(".chart").append("g") + .attr("class", "chart-lines"); + + if (__zoom_enabled) { // TODO: __zoom_privileged here? + // if zoom privileged, insert rect to forefront + main.insert('rect', __zoom_privileged ? null : 'g.grid') + .attr('class', 'zoom-rect') + .attr('width', width) + .attr('height', height) + .style('opacity', 0) + .style('cursor', 'ew-resize') + .call(zoom).on("dblclick.zoom", null); + } + + // Set default extent if defined + if (__axis_x_default !== null) { + brush.extent(typeof __axis_x_default !== 'function' ? __axis_x_default : __axis_x_default(firstX, lastX)); + } + + /*-- Context Region --*/ + + if (__subchart_show) { + // Define g for chart area + context.append('g') + .attr("clip-path", clipPath) + .attr('class', 'chart'); + + // Define g for bar chart area + context.select(".chart").append("g") + .attr("class", "chart-bars"); + + // Define g for line chart area + context.select(".chart").append("g") + .attr("class", "chart-lines"); + + // Add extent rect for Brush + context.append("g") + .attr("clip-path", clipPath) + .attr("class", "x brush") + .call(brush) + .selectAll("rect") + .attr("height", height2); + + // ATTENTION: This must be called AFTER chart added + // Add Axis + context.append("g") + .attr("class", "x axis") + .attr("transform", translate.subx) + .call(subXAxis); + } + + /*-- Legend Region --*/ + + if (__legend_show) { updateLegend(c3.data.targets); } + + // Set targets + updateTargets(c3.data.targets); + + // Draw with targets + redraw({withTransition: false, withUpdateXDomain: true}); + + // Show tooltip if needed + if (__tooltip_init_show) { + if (isTimeSeries && typeof __tooltip_init_x === 'string') { + __tooltip_init_x = parseDate(__tooltip_init_x); + for (i = 0; i < c3.data.targets[0].values.length; i++) { + if ((c3.data.targets[0].values[i].x - __tooltip_init_x) === 0) { break; } + } + __tooltip_init_x = i; + } + tooltip.html(__tooltip_contents(c3.data.targets.map(function (d) { + return addName(d.values[__tooltip_init_x]); + }))); + tooltip.style("top", __tooltip_init_position.top) + .style("left", __tooltip_init_position.left) + .style("display", "block"); + } + + // Bind resize event + if (window.onresize == null) { + window.onresize = resize; + } + } + + function generateEventRectsForSingleX(eventRect, data) { + eventRect .selectAll(".event-rects") .data(data) .enter().append("rect") @@ -1133,11 +1337,7 @@ .classed(EXPANDED, true); // Show xgrid focus line - main.selectAll('line.xgrid-focus') - .style("visibility", "visible") - .data([selectedData[0]]) - .attr(__axis_rotated ? 'y1' : 'x1', xx) - .attr(__axis_rotated ? 'y2' : 'x2', xx); + showXGridFocus(selectedData[0]); }) .on('mouseout', function (d, i) { main.select('line.xgrid-focus').style("visibility", "hidden"); @@ -1152,29 +1352,17 @@ .classed(EXPANDED, false); }) .on('mousemove', function (d, i) { - var selectedData = c3.data.targets.map(function (d) { + var selectedData; + + if (dragging) { return; } // do nothing when dragging + + // Show tooltip + selectedData = c3.data.targets.map(function (d) { return addName(d.values[i]); }); + showTooltip(selectedData, d3.mouse(this)); - // Construct tooltip - tooltip.html(__tooltip_contents(selectedData)) - .style("visibility", "hidden") - .style("display", "block"); - // Get tooltip dimensions - var tWidth = tooltip.property('offsetWidth'), - tHeight = tooltip.property('offsetHeight'); - // Set tooltip - // todo get rid of magic numbers - tooltip - .style("top", (d3.mouse(this)[1] + 15 + tHeight < getCurrentHeight() ? d3.mouse(this)[1] + 15 : d3.mouse(this)[1] - tHeight) + "px") - .style("left", ((__axis_rotated ? - d3.mouse(this)[0] : - (x(selectedData[0].x) + 60 + tWidth < getCurrentWidth()) ? - (x(selectedData[0].x) + 60) + "px" : (x(selectedData[0].x) - tWidth + 30) + "px" - ))) - .style("visibility", "visible"); - - if (! __data_selection_enabled || dragging) { return; } + if (! __data_selection_enabled) { return; } if (__data_selection_grouped) { return; } // nothing to do when grouped main.selectAll('.-shape-' + i) @@ -1207,183 +1395,160 @@ cancelClick = false; return; } - main.selectAll('.-shape-' + i).each(function (d) { - var _this = d3.select(this), - isSelected = _this.classed(SELECTED); - var isWithin = false, toggle; - if (this.nodeName === 'circle') { - isWithin = isWithinCircle(this, __point_select_r * 1.5); - toggle = togglePoint; - } - else if (this.nodeName === 'rect') { - isWithin = isWithinBar(this); - toggle = toggleBar; - } - if (__data_selection_grouped || isWithin) { - if (__data_selection_enabled && __data_selection_isselectable(d)) { - _this.classed(SELECTED, !isSelected); - toggle(!isSelected, _this, d, i); - } - __point_onclick(d, _this); // TODO: should be __data_onclick - } - }); + main.selectAll('.-shape-' + i).each(function (d) { selectShape(this, d, i); }); }) .call( - d3.behavior.drag().origin(Object).on('drag', function () { - if (! __data_selection_enabled) { return; } // do nothing if not selectable - if (__zoom_enabled && ! zoom.altDomain) { return; } // skip if zoomable because of conflict drag dehavior - - var sx = dragStart[0], sy = dragStart[1], - mouse = d3.mouse(this), - mx = mouse[0], - my = mouse[1], - minX = Math.min(sx, mx), - maxX = Math.max(sx, mx), - minY = (__data_selection_grouped) ? margin.top : Math.min(sy, my), - maxY = (__data_selection_grouped) ? height : Math.max(sy, my); - main.select('.dragarea') - .attr('x', minX) - .attr('y', minY) - .attr('width', maxX - minX) - .attr('height', maxY - minY); - main.selectAll('.-shapes').selectAll('.-shape') - .filter(function (d) { return __data_selection_isselectable(d); }) - .each(function (d, i) { - var _this = d3.select(this), - isSelected = _this.classed(SELECTED), - isIncluded = _this.classed(INCLUDED), - _x, _y, _w, toggle, isWithin = false; - if (this.nodeName === 'circle') { - _x = _this.attr("cx") * 1; - _y = _this.attr("cy") * 1; - toggle = togglePoint; - isWithin = minX < _x && _x < maxX && minY < _y && _y < maxY; - } - else if (this.nodeName === 'rect') { - _x = _this.attr("x") * 1; - _y = _this.attr("y") * 1; - _w = _this.attr('width') * 1; - toggle = toggleBar; - isWithin = minX < _x + _w && _x < maxX && _y < maxY; - } - if (isWithin ^ isIncluded) { - _this.classed(INCLUDED, !isIncluded); - // TODO: included/unincluded callback here - _this.classed(SELECTED, !isSelected); - toggle(!isSelected, _this, d, i); - } - }); - }) - .on('dragstart', function () { - if (! __data_selection_enabled) { return; } // do nothing if not selectable - dragStart = d3.mouse(this); - main.select('.chart').append('rect') - .attr('class', 'dragarea') - .style('opacity', 0.1); - dragging = true; - // TODO: add callback here - }) - .on('dragend', function () { - if (! __data_selection_enabled) { return; } // do nothing if not selectable - main.select('.dragarea') - .transition().duration(100) - .style('opacity', 0) - .remove(); - main.selectAll('.-shape') - .classed(INCLUDED, false); - dragging = false; - // TODO: add callback here - }) + d3.behavior.drag().origin(Object) + .on('drag', function () { drag(d3.mouse(this)); }) + .on('dragstart', function () { dragstart(d3.mouse(this)); }) + .on('dragend', function () { dragend(); }) ) .call(zoom).on("dblclick.zoom", null); + } - // Define g for bar chart area - main.select(".chart").append("g") - .attr("class", "chart-bars"); - - // Define g for line chart area - main.select(".chart").append("g") - .attr("class", "chart-lines"); - - if (__zoom_enabled) { - // if zoom privileged, insert rect to forefront - main.insert('rect', __zoom_privileged ? null : 'g.grid') - .attr('class', 'zoom-rect') - .attr('width', width) - .attr('height', height) - .style('opacity', 0) - .style('cursor', 'ew-resize') - .call(zoom).on("dblclick.zoom", null); - } - - // Set default extent if defined - if (__axis_x_default !== null) { - brush.extent(typeof __axis_x_default !== 'function' ? __axis_x_default : (isTimeSeries ? __axis_x_default(firstDate, lastDate) : __axis_x_default(0, maxDataCount() - 1))); - } - - /*-- Context Region --*/ + function generateEventRectsForMultipleXs(eventRect) { + eventRect.append('rect') + .attr('x', 0) + .attr('y', 0) + .attr('width', width) + .attr('height', height) + .attr('class', "event-rect") + .on('mousemove', function () { + var mouse = d3.mouse(this), + closest = findClosest(c3.data.targets, mouse); - if (__subchart_show) { - // Define g for chart area - context.append('g') - .attr("clip-path", clipPath) - .attr('class', 'chart'); + // show tooltip when cursor is close to some point + var selectedData = [addName(closest)]; + showTooltip(selectedData, mouse); - // Define g for bar chart area - context.select(".chart").append("g") - .attr("class", "chart-bars"); + // expand points + if (__point_focus_expand_enabled) { + main.selectAll('.-circle') + .filter(function () { return d3.select(this).classed(EXPANDED); }) + .classed(EXPANDED, false) + .attr('r', __point_r); + main.select('.-circles-' + closest.id).select('.-circle-' + closest.index) + .classed(EXPANDED, true) + .attr('r', __point_focus_expand_r); + } - // Define g for line chart area - context.select(".chart").append("g") - .attr("class", "chart-lines"); + // Show xgrid focus line + showXGridFocus(selectedData[0]); - // Add extent rect for Brush - context.append("g") - .attr("clip-path", clipPath) - .attr("class", "x brush") - .call(brush) - .selectAll("rect") - .attr("height", height2); + // Show cursor as pointer if point is close to mouse position + if (dist(closest, mouse) < 100) { + d3.select('.event-rect').style('cursor', 'pointer'); + } else { + d3.select('.event-rect').style('cursor', null); + } + }) + .on('click', function () { + var mouse = d3.mouse(this), + closest = findClosest(c3.data.targets, mouse); + + // select if selection enabled + if (dist(closest, mouse) < 100) { + main.select('.-circles-' + closest.id).select('.-circle-' + closest.index).each(function () { + selectShape(this, closest, closest.index); + }); + } + }) + .call( + d3.behavior.drag().origin(Object) + .on('drag', function () { drag(d3.mouse(this)); }) + .on('dragstart', function () { dragstart(d3.mouse(this)); }) + .on('dragend', function () { dragend(); }) + ) + .call(zoom).on("dblclick.zoom", null); + } - // ATTENTION: This must be called AFTER chart added - // Add Axis - context.append("g") - .attr("class", "x axis") - .attr("transform", translate.subx) - .call(subXAxis); + function selectShape(target, d, i) { + var _this = d3.select(target), + isSelected = _this.classed(SELECTED); + var isWithin = false, toggle; + if (target.nodeName === 'circle') { + isWithin = isWithinCircle(target, __point_select_r * 1.5); + toggle = togglePoint; } - - /*-- Legend Region --*/ - - if (__legend_show) { updateLegend(c3.data.targets); } - - // Set targets - updateTargets(c3.data.targets); - - // Draw with targets - redraw({withTransition: false, withUpdateXDomain: true}); - - // Show tooltip if needed - if (__tooltip_init_show) { - if (isTimeSeries && typeof __tooltip_init_x === 'string') { - __tooltip_init_x = parseDate(__tooltip_init_x); - for (i = 0; i < c3.data.targets[0].values.length; i++) { - if ((c3.data.targets[0].values[i].x - __tooltip_init_x) === 0) { break; } - } - __tooltip_init_x = i; + else if (target.nodeName === 'rect') { + isWithin = isWithinBar(target); + toggle = toggleBar; + } + if (__data_selection_grouped || isWithin) { + if (__data_selection_enabled && __data_selection_isselectable(d)) { + _this.classed(SELECTED, !isSelected); + toggle(!isSelected, _this, d, i); } - tooltip.html(__tooltip_contents(c3.data.targets.map(function (d) { - return addName(d.values[__tooltip_init_x]); - }))); - tooltip.style("top", __tooltip_init_position.top) - .style("left", __tooltip_init_position.left) - .style("display", "block"); + __point_onclick(d, _this); // TODO: should be __data_onclick } + } - // Bind resize event - if (window.onresize == null) { - window.onresize = resize; - } + function drag(mouse) { + if (! __data_selection_enabled) { return; } // do nothing if not selectable + if (__zoom_enabled && ! zoom.altDomain) { return; } // skip if zoomable because of conflict drag dehavior + + var sx = dragStart[0], sy = dragStart[1], + mx = mouse[0], + my = mouse[1], + minX = Math.min(sx, mx), + maxX = Math.max(sx, mx), + minY = (__data_selection_grouped) ? margin.top : Math.min(sy, my), + maxY = (__data_selection_grouped) ? height : Math.max(sy, my); + main.select('.dragarea') + .attr('x', minX) + .attr('y', minY) + .attr('width', maxX - minX) + .attr('height', maxY - minY); + main.selectAll('.-shapes').selectAll('.-shape') + .filter(function (d) { return __data_selection_isselectable(d); }) + .each(function (d, i) { + var _this = d3.select(this), + isSelected = _this.classed(SELECTED), + isIncluded = _this.classed(INCLUDED), + _x, _y, _w, toggle, isWithin = false; + if (this.nodeName === 'circle') { + _x = _this.attr("cx") * 1; + _y = _this.attr("cy") * 1; + toggle = togglePoint; + isWithin = minX < _x && _x < maxX && minY < _y && _y < maxY; + } + else if (this.nodeName === 'rect') { + _x = _this.attr("x") * 1; + _y = _this.attr("y") * 1; + _w = _this.attr('width') * 1; + toggle = toggleBar; + isWithin = minX < _x + _w && _x < maxX && _y < maxY; + } + if (isWithin ^ isIncluded) { + _this.classed(INCLUDED, !isIncluded); + // TODO: included/unincluded callback here + _this.classed(SELECTED, !isSelected); + toggle(!isSelected, _this, d, i); + } + }); + } + + function dragstart(mouse) { + if (! __data_selection_enabled) { return; } // do nothing if not selectable + dragStart = mouse; + main.select('.chart').append('rect') + .attr('class', 'dragarea') + .style('opacity', 0.1); + dragging = true; + // TODO: add callback here + } + + function dragend() { + if (! __data_selection_enabled) { return; } // do nothing if not selectable + main.select('.dragarea') + .transition().duration(100) + .style('opacity', 0) + .remove(); + main.selectAll('.-shape') + .classed(INCLUDED, false); + dragging = false; + // TODO: add callback here + } function redraw(options) { @@ -1432,8 +1597,8 @@ if (__grid_x_show) { if (__grid_x_type === 'year') { xgridData = []; - var firstYear = firstDate.getFullYear(); - var lastYear = lastDate.getFullYear(); + var firstYear = firstX.getFullYear(); + var lastYear = lastX.getFullYear(); for (var year = firstYear; year <= lastYear; year++) { xgridData.push(new Date(year + '-01-01 00:00:00')); } @@ -1574,24 +1739,26 @@ .attr("cy", __axis_rotated ? circleX : circleY); // rect for mouseover - if (isCustomX) { - rectW = function (d, i) { - var prevX = getPrevX(i), nextX = getNextX(i); - return (x(nextX ? nextX : d.x + 50) - x(prevX ? prevX : d.x - 50)) / 2; - }; - rectX = function (d, i) { - var prevX = getPrevX(i); - return (x(d.x) + x(prevX ? prevX : d.x - 50)) / 2; - }; - } else { - rectW = (((__axis_rotated ? height : width) * getXDomainRatio()) / (maxDataCount() - 1)); - rectX = function (d) { return x(d.x) - (rectW / 2); }; + if (! __data_xs) { + if (isCustomX) { + rectW = function (d, i) { + var prevX = getPrevX(i), nextX = getNextX(i); + return (x(nextX ? nextX : d.x + 50) - x(prevX ? prevX : d.x - 50)) / 2; + }; + rectX = function (d, i) { + var prevX = getPrevX(i); + return (x(d.x) + x(prevX ? prevX : d.x - 50)) / 2; + }; + } else { + rectW = (((__axis_rotated ? height : width) * getXDomainRatio()) / (maxDataCount() - 1)); + rectX = function (d) { return x(d.x) - (rectW / 2); }; + } + main.selectAll('.event-rect') + .attr("x", __axis_rotated ? 0 : rectX) + .attr("y", __axis_rotated ? rectX : 0) + .attr("width", __axis_rotated ? width : rectW) + .attr("height", __axis_rotated ? rectW : height); } - main.selectAll('.event-rect') - .attr("x", __axis_rotated ? 0 : rectX) - .attr("y", __axis_rotated ? rectX : 0) - .attr("width", __axis_rotated ? width : rectW) - .attr("height", __axis_rotated ? rectW : height); // rect for regions var mainRegion = main.select('.regions').selectAll('rect.region') @@ -2042,7 +2209,7 @@ c3.destroy = function () { c3.data.targets = undefined; - c3.data.x = undefined; + c3.data.x = {}; selectChart.html(""); window.onresize = null; }; diff --git a/c3.min.js b/c3.min.js index 1a08aaf..f5d943d 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,69 +1,72 @@ -(function(O){function xc(){function n(e,c){e.attr("transform",function(e){return"translate("+(c(e)+Z)+", 0)"})}function r(e,c){e.attr("transform",function(e){return"translate(0,"+c(e)+")"})}function O(e){var c=e[0];e=e[e.length-1];return ca?0:a}function nb(a){var b=Ia[a.id];a.name=n(b)?b:a.id;return a}function Wb(a){var b=a[0],d={},k=[],e,c;for(e=1;ew[d].indexOf(e.id)))for(k=0;k=g;g+=s)u+=e(a[c-1],a[c],g,v)}return u} -function wb(a){var b,d;db=e.select(ua);if(db.empty())O.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{db.html("");g.data.x=void 0;g.data.targets=Ja(a);sa();Eb();l.domain(e.extent(a.map(function(a){return a.x})));y.domain(ka("y"));T.domain(ka("y2"));ba.domain(l.domain());Wa.domain(y.domain());Xa.domain(T.domain());B.ticks(10>a.length?a.length:10);na.ticks(Zc).outerTickSize(0).tickFormat($c);Ya.ticks(ad).outerTickSize(0).tickFormat(bd); -U=l.domain();G.x(ba);pa&&H.x(l);Ma=e.select(ua).append("svg").attr("width",p+A+aa).attr("height",t+s+F).on("mouseenter",cd).on("mouseleave",dd);eb=Ma.append("defs");eb.append("clipPath").attr("id",xb).append("rect").attr("y",s).attr("width",p).attr("height",t-s);eb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",Q).attr("height",P);eb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",s-1).attr("width",ja).attr("height", -hb);h=Ma.append("g").attr("transform",K.main);x=wa?Ma.append("g").attr("transform",K.context):null;xa=ya?Ma.append("g").attr("transform",K.legend):null;X=e.select(ua).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");h.append("g").attr("class","x axis").attr("clip-path",f?"":"url(#xaxis-clip)").attr("transform",K.x).call(f?na:B).append("text").attr("class","-axis-x-label").attr("x",p).attr("dy","-.5em").style("text-anchor","end").text(ed); -h.append("g").attr("class","y axis").attr("clip-path",f?"url(#yaxis-clip)":"").call(f?B:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(fd);Mb&&h.append("g").attr("class","y2 axis").attr("transform",K.y2).call(Ya);b=h.append("g").attr("clip-path",Na).attr("class","grid");nc&&b.append("g").attr("class","xgrids");yb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(yb).enter().append("g").attr("class", -"xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",f?"":"rotate(-90)").attr("dx",f?0:-s).attr("dy",-6).text(function(a){return a.text}));gd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",f?0:-10).attr("x2",f?p:-10).attr("y1",f?-10:s).attr("y2",f?-10:t);oc&&b.append("g").attr("class","ygrids");zb&&b.append("g").attr("class", -"ygrid-lines").selectAll("ygrid-line").data(zb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});h.append("g").attr("clip-path",Na).attr("class","regions");h.append("g").attr("clip-path",Na).attr("class","chart");h.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",pa?"ew-resize":null).selectAll(".event-rects").data(a).enter().append("rect").attr("class",function(a,b){return"event-rect event-rect-"+b}).style("cursor",ga&& -qa?"pointer":null).on("mouseover",function(a,b){if(!fb){var d=g.data.targets.map(function(a){return nb(a.values[b])}),e,c;if(0",d,c,e;for(d=0;d"+e+""+c+"";return b+""}),jd=c(["tooltip","init","show"],!1),za=c(["tooltip","init","x"],0),tc=c(["tooltip","init","position"],{top:"0px",left:"50px"}),xb=ua.replace("#","")+"-clip",Na="url(#"+xb+")",z="timeseries"===wc,ca="categorized"===wc,ob=!z&&V,Cb=null,fb=!1,Bb=!1,la=ya?40: -0,oa=e.time.format(qd).parse,W=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(rd,sd),Fc=function(){var a=[[e.time.format("%Y/%-m/%-d"),function(){return!0}],[e.time.format("%-m/%-d"),function(a){return a.getMonth()}],[e.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[e.time.format("%-m/%-d"),function(a){return a.getDay()&& -1!==a.getDate()}],[e.time.format("%I %p"),function(a){return a.getHours()}],[e.time.format("%I:%M"),function(a){return a.getMinutes()}],[e.time.format(":%S"),function(a){return a.getSeconds()}],[e.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var d=a.length-1,c=a[d];!c[1](b);)c=a[--d];return c[0](b)}}(),Ib,Pb,Kb,Va,Ob,Qb,p,t,ma,ib,ta,Sb,Tb,lb,mb,l,y,T,ba,Wa,Xa,B,na,Ya,Da,Ac=f?"left":"bottom",Bc=f?kb?"top":"bottom":kb?"right":"left",Cc=f?jb?"bottom":"top":jb?"left": -"right",Dc="bottom",K={main:function(){return"translate("+A+","+s+")"},context:function(){return"translate("+m+","+Aa+")"},legend:function(){return"translate("+Gb+","+Fb+")"},y2:function(){return"translate("+(f?0:p)+","+(f?10:0)+")"},x:function(){return"translate(0,"+t+")"},subx:function(){return"translate(0,"+ma+")"}},md=function(){var a=e.svg.line().x(f?function(a){return E(a.id)(a.value)}:cb).y(f?cb:function(a){return E(a.id)(a.value)});return function(b){var d=lc(b.values),c;if(ub(b))return"spline"=== -fa["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),vc[b.id]?Yc(d,l,E(b.id),vc[b.id]):a(d);c=l(d[0].x);b=E(b.id)(d[0].value);return f?"M "+b+" "+c:"M "+c+" "+b}}(),nd=function(){var a=e.svg.line().x(function(a){return ba(a.x)}).y(function(a){return R(a.id)(a.value)});return function(b){var d=lc(b.values);return ub(b)?a(d):"M "+ba(d[0].x)+" "+R(b.id)(d[0].value)}}(),G=e.svg.brush().on("brush",function(){C({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}), -H=e.behavior.zoom().on("zoomstart",function(){H.altDomain=e.event.sourceEvent.altKey?l.orgDomain():null}).on("zoom",pa?od:null);G.update=function(){x&&x.select(".x.brush").call(this);return this};H.orgScaleExtent=function(){var a=uc?uc:[1,10];return[a[0],Math.max(va()/a[1],a[1])]};H.updateScaleExtent=function(){var a=l.orgDomain(),a=(a[1]-a[0])/(U[1]-U[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Ma,eb,h,x,xa,X,db,bb=null,pb=null,U;g.focus=function(a){g.defocus(); -e.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};g.defocus=function(a){e.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",0.3)};g.revert=function(a){e.selectAll(Ra(a)).filter(function(a){return rb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};g.show=function(a){e.selectAll(Ra(a)).transition().style("opacity",1)};g.hide=function(a){e.selectAll(Ra(a)).transition().style("opacity", -0)};g.unzoom=function(){G.clear().update();C({withUpdateXDomain:!0})};g.load=function(a){r(a.done)&&(a.done=function(){});"categories"in a&&ca&&(Ea=a.categories,B.categories(Ea));if("cacheIds"in a&&Sa(a.cacheIds))Pa(Ta(a.cacheIds),a.done);else if("data"in a)Pa(Ja(a.data),a.done);else if("url"in a)e.csv(a.url,function(b,d){Pa(Ja(d),a.done)});else if("rows"in a)Pa(Ja(Wb(a.rows)),a.done);else if("columns"in a)Pa(Ja(Xb(a.columns)),a.done);else throw Error("url or rows or columns is required.");};g.unload= -function(a){g.data.targets=g.data.targets.filter(function(b){return b.id!==a});e.selectAll(".target-"+a).transition().style("opacity",0).remove();ya&&(e.selectAll(".legend-item-"+a).remove(),gb(g.data.targets));0b.classes.indexOf(a)})});return L}; -g.data.get=function(a){a=g.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};g.data.getAsTarget=function(a){var b=$a(function(b){return b.id===a});return 0a?0:a}function ac(a){return qa&&a===qa||X&&ad(X,a)}function bd(a){return!ac(a)}function eb(a){var b=Ka[a.id];a.name=n(b)?b:a.id;return a}function bc(a){var b=a[0],d={},f=[],c,e;for(c=1;ct[d].indexOf(c.id)))for(f=0;f=e;e+=r)h+=f(a[c-1],a[c],e,l)}return h}function Ab(a){var b,d;gb=c.select(wa);if(gb.empty())Q.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".'); +else{gb.html("");h.data.x={};h.data.targets=La(a);ua();Jb();m.domain(c.extent([xa,Ma]));u.domain(la("y"));V.domain(la("y2"));da.domain(m.domain());Za.domain(u.domain());$a.domain(V.domain());z.ticks(10>a.length?a.length:10);oa.ticks(nd).outerTickSize(0).tickFormat(od);ab.ticks(pd).outerTickSize(0).tickFormat(qd);W=m.domain();G.x(da);ra&&B.x(m);Qa=c.select(wa).append("svg").attr("width",q+y+ca).attr("height",p+r+F).on("mouseenter",rd).on("mouseleave",sd);hb=Qa.append("defs");hb.append("clipPath").attr("id", +Bb).append("rect").attr("y",r).attr("width",q).attr("height",p-r);hb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-y).attr("y",-20).attr("width",S).attr("height",R);hb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-y+1).attr("y",r-1).attr("width",ka).attr("height",mb);k=Qa.append("g").attr("transform",J.main);v=ya?Qa.append("g").attr("transform",J.context):null;za=Aa?Qa.append("g").attr("transform",J.legend):null;Y=c.select(wa).style("position","relative").append("div").style("position", +"absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",J.x).call(g?oa:z).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(td);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?z:oa).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(ud);Rb&& +k.append("g").attr("class","y2 axis").attr("transform",J.y2).call(ab);b=k.append("g").attr("clip-path",Ra).attr("class","grid");zc&&b.append("g").attr("class","xgrids");Cb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Cb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g? +0:-r).attr("dy",-6).text(function(a){return a.text}));vd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2",g?q:-10).attr("y1",g?-10:r).attr("y2",g?-10:p);Ac&&b.append("g").attr("class","ygrids");Db&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Db).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Ra).attr("class","regions");k.append("g").attr("clip-path", +Ra).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",ra?"ew-resize":null);X?wd(b):xd(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(ra)k.insert("rect",yd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(B).on("dblclick.zoom",null);null!==ib&&G.extent("function"!==typeof ib? +ib:ib(xa,Ma));ya&&(v.append("g").attr("clip-path",Ra).attr("class","chart"),v.select(".chart").append("g").attr("class","chart-bars"),v.select(".chart").append("g").attr("class","chart-lines"),v.append("g").attr("clip-path",Ra).attr("class","x brush").call(G).selectAll("rect").attr("height",na),v.append("g").attr("class","x axis").attr("transform",J.subx).call(Fa));Aa&&jb(h.data.targets);Bc(h.data.targets);C({withTransition:!1,withUpdateXDomain:!0});if(zd){if(A&&"string"===typeof Ba){Ba=pa(Ba);for(a= +0;asc(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor",null)}).on("click",function(){var a=c.mouse(this),d=ic(h.data.targets,a);100>sc(d, +a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Dc(this,d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Ec(c.mouse(this))}).on("dragstart",function(){Fc(c.mouse(this))}).on("dragend",function(){Gc()})).call(B).on("dblclick.zoom",null)}function Dc(a,b,d){var f=c.select(a),e=f.classed(ja),g=!1,h;"circle"===a.nodeName?(g=qc(a,1.5*Pa),h=uc):"rect"===a.nodeName&&(g=rc(a),h=wc);if(sa||g)ia&&ta(b)&&(f.classed(ja,!e),h(!e,f,b,d)),Bd(b,f)}function Ec(a){if(ia&& +(!ra||B.altDomain)){var b=Hb[0],d=Hb[1],f=a[0];a=a[1];var e=Math.min(b,f),g=Math.max(b,f),h=sa?r:Math.min(d,a),m=sa?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ta(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ja),k=d.classed(Ib),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"),n=1*d.attr("cy"),q=uc,l=e",c,e,g;for(c=0;c"+g+""+e+"";return b+""}),zd=e(["tooltip","init","show"],!1),Ba=e(["tooltip","init","x"],0),Cc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Bb=wa.replace("#","")+"-clip",Ra="url(#"+Bb+")",A="timeseries"===Jc,ea="categorized"===Jc,sb=!A&&(qa||X),Hb=null,kb=!1,Gb=!1,ma=Aa?40:0,Z=function(a,b){var c=[],e=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in +a)return a[b];-1===c.indexOf(b)&&c.push(b);return e[c.indexOf(b)%e.length]}}(Hd,Id),Sc=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}], +[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Nb,Ub,Pb,Ya,Tb,Vb,q,p,na,nb,va,Xb,Yb,qb,rb,m,u,V,da,Za,$a,z,oa,ab,Fa,Nc=g?"left":"bottom",Oc=g?pb?"top":"bottom":pb?"right":"left",Pc=g?ob?"bottom":"top":ob?"left":"right",Qc="bottom",J={main:function(){return"translate("+y+","+r+")"},context:function(){return"translate("+l+","+Ca+")"},legend:function(){return"translate("+Lb+","+Kb+")"},y2:function(){return"translate("+ +(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+na+")"}},Dd=function(){var a=c.svg.line().x(g?function(a){return E(a.id)(a.value)}:fb).y(g?fb:function(a){return E(a.id)(a.value)});return function(b){var c=xc(b.values),e;if(xb(b))return"spline"===ha["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Ic[b.id]?md(c,m,E(b.id),Ic[b.id]):a(c);e=m(c[0].x);b=E(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Ed=function(){var a= +c.svg.line().x(function(a){return da(a.x)}).y(function(a){return T(a.id)(a.value)});return function(b){var c=xc(b.values);return xb(b)?a(c):"M "+da(c[0].x)+" "+T(b.id)(c[0].value)}}(),G=c.svg.brush().on("brush",function(){C({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}),B=c.behavior.zoom().on("zoomstart",function(){B.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Fd:null);G.update=function(){v&&v.select(".x.brush").call(this);return this};B.orgScaleExtent= +function(){var a=Hc?Hc:[1,10];return[a[0],Math.max(Na()/a[1],a[1])]};B.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(W[1]-W[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Qa,hb,k,v,za,Y,gb,xa=null,Ma=null,W;h.focus=function(a){h.defocus();c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused", +!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Ua(a)).transition().style("opacity",1)};h.hide=function(a){c.selectAll(Ua(a)).transition().style("opacity",0)};h.unzoom=function(){G.clear().update();C({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&ea&&(Ga=a.categories,z.categories(Ga)); +if("cacheIds"in a&&Va(a.cacheIds))Sa(Wa(a.cacheIds),a.done);else if("data"in a)Sa(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Sa(La(c),a.done)});else if("rows"in a)Sa(La(bc(a.rows)),a.done);else if("columns"in a)Sa(La(cc(a.columns)),a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Aa&&(c.selectAll(".legend-item-"+ +a).remove(),jb(h.data.targets));0b.classes.indexOf(a)})});return L};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b= +cb(function(b){return b.id===a});return 0 Date: Mon, 3 Feb 2014 19:22:58 +0900 Subject: [PATCH 19/31] Fix bugs --- c3.js | 87 ++++++++++++++++++++------------ c3.min.js | 145 +++++++++++++++++++++++++++--------------------------- 2 files changed, 128 insertions(+), 104 deletions(-) diff --git a/c3.js b/c3.js index 2cc64a3..696cb47 100644 --- a/c3.js +++ b/c3.js @@ -673,6 +673,9 @@ ))) .style("visibility", "visible"); } + function hideTooltip() { + tooltip.style("display", "none"); + } function showXGridFocus(data) { main.selectAll('line.xgrid-focus') @@ -681,6 +684,9 @@ .attr(__axis_rotated ? 'y1' : 'x1', xx) .attr(__axis_rotated ? 'y2' : 'x2', xx); } + function hideXGridFocus() { + main.select('line.xgrid-focus').style("visibility", "hidden"); + } //-- Circle --// @@ -734,14 +740,14 @@ function getBarW(axis, barTargetsNum, isSub) { var barW; if (isCategorized) { - barW = (axis.tickOffset() * 2 * 0.6) / barTargetsNum; + barW = barTargetsNum ? (axis.tickOffset() * 2 * 0.6) / barTargetsNum : 0; } else { barW = (((__axis_rotated ? height : width) * getXDomainRatio(isSub)) / (maxDataCount() - 1)) * 0.6; } return barW; } function getBarH(height, isSub) { - var h = height === null ? function (v) { return v; } : function (v) { return height - v; }; + var h = height === null ? function (v) { return v; } : function (v) { return height > v ? height - v : 0; }; return function (d) { var scale = isSub ? getSubYScale(d.id) : getYScale(d.id); return h(scale(d.value)); @@ -895,6 +901,30 @@ //-- Shape --// + function getCircles(i, id) { + return (id ? main.selectAll('.-circles-' + id) : main).selectAll('.-circle' + (i || i === 0 ? '-' + i : '')); + } + function expandCircles(i, id) { + getCircles(i, id) + .classed(EXPANDED, true) + .attr('r', __point_focus_expand_r); + } + function unexpandCircles(i) { + getCircles(i) + .filter(function () { return d3.select(this).classed(EXPANDED); }) + .classed(EXPANDED, false) + .attr('r', __point_r); + } + function getBars(i) { + return main.selectAll(".-bar" + (i || i === 0 ? '-' + i : '')); + } + function expandBars(i) { + getBars(i).classed(EXPANDED, false); + } + function unexpandBars(i) { + getBars(i).classed(EXPANDED, false); + } + // For main region var lineOnMain = (function () { var line = d3.svg.line() @@ -1325,31 +1355,19 @@ selectedData = newData.concat(selectedData); // Add remained } - // Expand circles if needed - if (__point_focus_expand_enabled) { - main.selectAll('.-circle-' + i) - .classed(EXPANDED, true) - .attr('r', __point_focus_expand_r); - } - - // Expand bars - main.selectAll(".-bar-" + i) - .classed(EXPANDED, true); + // Expand shapes if needed + if (__point_focus_expand_enabled) { expandCircles(i); } + expandBars(i); // Show xgrid focus line showXGridFocus(selectedData[0]); }) .on('mouseout', function (d, i) { - main.select('line.xgrid-focus').style("visibility", "hidden"); - tooltip.style("display", "none"); - // Undo expanded circles - main.selectAll('.-circle-' + i) - .filter(function () { return d3.select(this).classed(EXPANDED); }) - .classed(EXPANDED, false) - .attr('r', __point_r); - // Undo expanded bar - main.selectAll(".-bar-" + i) - .classed(EXPANDED, false); + hideXGridFocus(); + hideTooltip(); + // Undo expanded shapes + unexpandCircles(i); + unexpandBars(); }) .on('mousemove', function (d, i) { var selectedData; @@ -1413,23 +1431,27 @@ .attr('width', width) .attr('height', height) .attr('class', "event-rect") + .on('mouseout', function () { + hideXGridFocus(); + hideTooltip(); + unexpandCircles(); + }) .on('mousemove', function () { - var mouse = d3.mouse(this), - closest = findClosest(c3.data.targets, mouse); + var mouse, closest, selectedData; + + if (dragging) { return; } // do nothing when dragging + + mouse = d3.mouse(this); + closest = findClosest(c3.data.targets, mouse); // show tooltip when cursor is close to some point - var selectedData = [addName(closest)]; + selectedData = [addName(closest)]; showTooltip(selectedData, mouse); // expand points if (__point_focus_expand_enabled) { - main.selectAll('.-circle') - .filter(function () { return d3.select(this).classed(EXPANDED); }) - .classed(EXPANDED, false) - .attr('r', __point_r); - main.select('.-circles-' + closest.id).select('.-circle-' + closest.index) - .classed(EXPANDED, true) - .attr('r', __point_focus_expand_r); + unexpandCircles(); + expandCircles(closest.index, closest.id); } // Show xgrid focus line @@ -1499,6 +1521,7 @@ .attr('y', minY) .attr('width', maxX - minX) .attr('height', maxY - minY); + // TODO: binary search when multiple xs main.selectAll('.-shapes').selectAll('.-shape') .filter(function (d) { return __data_selection_isselectable(d); }) .each(function (d, i) { diff --git a/c3.min.js b/c3.min.js index f5d943d..98f4b28 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,72 +1,73 @@ -(function(Q){function Kc(){function n(c,e){c.attr("transform",function(c){return"translate("+(e(c)+aa)+", 0)"})}function s(c,e){c.attr("transform",function(c){return"translate(0,"+e(c)+")"})}function Q(c){var e=c[0];c=c[c.length-1];return ea?0:a}function ac(a){return qa&&a===qa||X&&ad(X,a)}function bd(a){return!ac(a)}function eb(a){var b=Ka[a.id];a.name=n(b)?b:a.id;return a}function bc(a){var b=a[0],d={},f=[],c,e;for(c=1;ct[d].indexOf(c.id)))for(f=0;f=e;e+=r)h+=f(a[c-1],a[c],e,l)}return h}function Ab(a){var b,d;gb=c.select(wa);if(gb.empty())Q.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".'); -else{gb.html("");h.data.x={};h.data.targets=La(a);ua();Jb();m.domain(c.extent([xa,Ma]));u.domain(la("y"));V.domain(la("y2"));da.domain(m.domain());Za.domain(u.domain());$a.domain(V.domain());z.ticks(10>a.length?a.length:10);oa.ticks(nd).outerTickSize(0).tickFormat(od);ab.ticks(pd).outerTickSize(0).tickFormat(qd);W=m.domain();G.x(da);ra&&B.x(m);Qa=c.select(wa).append("svg").attr("width",q+y+ca).attr("height",p+r+F).on("mouseenter",rd).on("mouseleave",sd);hb=Qa.append("defs");hb.append("clipPath").attr("id", -Bb).append("rect").attr("y",r).attr("width",q).attr("height",p-r);hb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-y).attr("y",-20).attr("width",S).attr("height",R);hb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-y+1).attr("y",r-1).attr("width",ka).attr("height",mb);k=Qa.append("g").attr("transform",J.main);v=ya?Qa.append("g").attr("transform",J.context):null;za=Aa?Qa.append("g").attr("transform",J.legend):null;Y=c.select(wa).style("position","relative").append("div").style("position", -"absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",J.x).call(g?oa:z).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(td);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?z:oa).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(ud);Rb&& -k.append("g").attr("class","y2 axis").attr("transform",J.y2).call(ab);b=k.append("g").attr("clip-path",Ra).attr("class","grid");zc&&b.append("g").attr("class","xgrids");Cb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Cb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g? -0:-r).attr("dy",-6).text(function(a){return a.text}));vd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2",g?q:-10).attr("y1",g?-10:r).attr("y2",g?-10:p);Ac&&b.append("g").attr("class","ygrids");Db&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Db).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Ra).attr("class","regions");k.append("g").attr("clip-path", -Ra).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",ra?"ew-resize":null);X?wd(b):xd(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(ra)k.insert("rect",yd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(B).on("dblclick.zoom",null);null!==ib&&G.extent("function"!==typeof ib? -ib:ib(xa,Ma));ya&&(v.append("g").attr("clip-path",Ra).attr("class","chart"),v.select(".chart").append("g").attr("class","chart-bars"),v.select(".chart").append("g").attr("class","chart-lines"),v.append("g").attr("clip-path",Ra).attr("class","x brush").call(G).selectAll("rect").attr("height",na),v.append("g").attr("class","x axis").attr("transform",J.subx).call(Fa));Aa&&jb(h.data.targets);Bc(h.data.targets);C({withTransition:!1,withUpdateXDomain:!0});if(zd){if(A&&"string"===typeof Ba){Ba=pa(Ba);for(a= -0;asc(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor",null)}).on("click",function(){var a=c.mouse(this),d=ic(h.data.targets,a);100>sc(d, -a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Dc(this,d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Ec(c.mouse(this))}).on("dragstart",function(){Fc(c.mouse(this))}).on("dragend",function(){Gc()})).call(B).on("dblclick.zoom",null)}function Dc(a,b,d){var f=c.select(a),e=f.classed(ja),g=!1,h;"circle"===a.nodeName?(g=qc(a,1.5*Pa),h=uc):"rect"===a.nodeName&&(g=rc(a),h=wc);if(sa||g)ia&&ta(b)&&(f.classed(ja,!e),h(!e,f,b,d)),Bd(b,f)}function Ec(a){if(ia&& -(!ra||B.altDomain)){var b=Hb[0],d=Hb[1],f=a[0];a=a[1];var e=Math.min(b,f),g=Math.max(b,f),h=sa?r:Math.min(d,a),m=sa?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ta(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ja),k=d.classed(Ib),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"),n=1*d.attr("cy"),q=uc,l=e",c,e,g;for(c=0;c"+g+""+e+"";return b+""}),zd=e(["tooltip","init","show"],!1),Ba=e(["tooltip","init","x"],0),Cc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Bb=wa.replace("#","")+"-clip",Ra="url(#"+Bb+")",A="timeseries"===Jc,ea="categorized"===Jc,sb=!A&&(qa||X),Hb=null,kb=!1,Gb=!1,ma=Aa?40:0,Z=function(a,b){var c=[],e=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in -a)return a[b];-1===c.indexOf(b)&&c.push(b);return e[c.indexOf(b)%e.length]}}(Hd,Id),Sc=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}], -[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Nb,Ub,Pb,Ya,Tb,Vb,q,p,na,nb,va,Xb,Yb,qb,rb,m,u,V,da,Za,$a,z,oa,ab,Fa,Nc=g?"left":"bottom",Oc=g?pb?"top":"bottom":pb?"right":"left",Pc=g?ob?"bottom":"top":ob?"left":"right",Qc="bottom",J={main:function(){return"translate("+y+","+r+")"},context:function(){return"translate("+l+","+Ca+")"},legend:function(){return"translate("+Lb+","+Kb+")"},y2:function(){return"translate("+ -(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+na+")"}},Dd=function(){var a=c.svg.line().x(g?function(a){return E(a.id)(a.value)}:fb).y(g?fb:function(a){return E(a.id)(a.value)});return function(b){var c=xc(b.values),e;if(xb(b))return"spline"===ha["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Ic[b.id]?md(c,m,E(b.id),Ic[b.id]):a(c);e=m(c[0].x);b=E(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Ed=function(){var a= -c.svg.line().x(function(a){return da(a.x)}).y(function(a){return T(a.id)(a.value)});return function(b){var c=xc(b.values);return xb(b)?a(c):"M "+da(c[0].x)+" "+T(b.id)(c[0].value)}}(),G=c.svg.brush().on("brush",function(){C({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}),B=c.behavior.zoom().on("zoomstart",function(){B.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Fd:null);G.update=function(){v&&v.select(".x.brush").call(this);return this};B.orgScaleExtent= -function(){var a=Hc?Hc:[1,10];return[a[0],Math.max(Na()/a[1],a[1])]};B.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(W[1]-W[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Qa,hb,k,v,za,Y,gb,xa=null,Ma=null,W;h.focus=function(a){h.defocus();c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused", -!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Ua(a)).transition().style("opacity",1)};h.hide=function(a){c.selectAll(Ua(a)).transition().style("opacity",0)};h.unzoom=function(){G.clear().update();C({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&ea&&(Ga=a.categories,z.categories(Ga)); -if("cacheIds"in a&&Va(a.cacheIds))Sa(Wa(a.cacheIds),a.done);else if("data"in a)Sa(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Sa(La(c),a.done)});else if("rows"in a)Sa(La(bc(a.rows)),a.done);else if("columns"in a)Sa(La(cc(a.columns)),a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Aa&&(c.selectAll(".legend-item-"+ -a).remove(),jb(h.data.targets));0b.classes.indexOf(a)})});return L};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b= -cb(function(b){return b.id===a});return 0a?0:a}function cc(a){return qa&&a===qa||X&&ed(X,a)}function fd(a){return!cc(a)}function fb(a){var b=Ka[a.id];a.name=n(b)?b:a.id;return a}function dc(a){var b=a[0],d={},f=[],c,e;for(c=1;ct[d].indexOf(c.id)))for(f=0;fb?a-b:0};return function(a){var c=b?T(a.id):E(a.id);return d(c(a.value))}}function vb(a,b){var d=s(a)?sb():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+=r)h+=f(a[c-1],a[c],e,l)}return h}function Cb(a){var b,d;hb=c.select(wa);if(hb.empty())Q.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{hb.html("");h.data.x={};h.data.targets=La(a);ua();Lb();m.domain(c.extent([xa, +Ma]));u.domain(la("y"));V.domain(la("y2"));da.domain(m.domain());$a.domain(u.domain());ab.domain(V.domain());z.ticks(10>a.length?a.length:10);oa.ticks(rd).outerTickSize(0).tickFormat(sd);bb.ticks(td).outerTickSize(0).tickFormat(ud);W=m.domain();G.x(da);ra&&B.x(m);Qa=c.select(wa).append("svg").attr("width",q+y+ca).attr("height",p+r+F).on("mouseenter",vd).on("mouseleave",wd);ib=Qa.append("defs");ib.append("clipPath").attr("id",Db).append("rect").attr("y",r).attr("width",q).attr("height",p-r);ib.append("clipPath").attr("id", +"xaxis-clip").append("rect").attr("x",-1-y).attr("y",-20).attr("width",S).attr("height",R);ib.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-y+1).attr("y",r-1).attr("width",ka).attr("height",lb);k=Qa.append("g").attr("transform",J.main);v=ya?Qa.append("g").attr("transform",J.context):null;za=Aa?Qa.append("g").attr("transform",J.legend):null;P=c.select(wa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class", +"x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",J.x).call(g?oa:z).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(xd);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?z:oa).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(yd);Tb&&k.append("g").attr("class","y2 axis").attr("transform",J.y2).call(bb);b=k.append("g").attr("clip-path", +Ra).attr("class","grid");Dc&&b.append("g").attr("class","xgrids");Eb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Eb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g?0:-r).attr("dy",-6).text(function(a){return a.text}));zd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class", +"xgrid-focus").attr("x1",g?0:-10).attr("x2",g?q:-10).attr("y1",g?-10:r).attr("y2",g?-10:p);Ec&&b.append("g").attr("class","ygrids");Fb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Fb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Ra).attr("class","regions");k.append("g").attr("clip-path",Ra).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor", +ra?"ew-resize":null);X?Ad(b):Bd(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(ra)k.insert("rect",Cd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(B).on("dblclick.zoom",null);null!==jb&&G.extent("function"!==typeof jb?jb:jb(xa,Ma));ya&&(v.append("g").attr("clip-path",Ra).attr("class","chart"),v.select(".chart").append("g").attr("class","chart-bars"), +v.select(".chart").append("g").attr("class","chart-lines"),v.append("g").attr("clip-path",Ra).attr("class","x brush").call(G).selectAll("rect").attr("height",na),v.append("g").attr("class","x axis").attr("transform",J.subx).call(Fa));Aa&&kb(h.data.targets);Fc(h.data.targets);C({withTransition:!1,withUpdateXDomain:!0});if(Dd){if(A&&"string"===typeof Ba){Ba=pa(Ba);for(a=0;avc(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor", +null))}).on("click",function(){var a=c.mouse(this),d=kc(h.data.targets,a);100>vc(d,a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Hc(this,d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Ic(c.mouse(this))}).on("dragstart",function(){Jc(c.mouse(this))}).on("dragend",function(){Kc()})).call(B).on("dblclick.zoom",null)}function Hc(a,b,d){var f=c.select(a),e=f.classed(ja),g=!1,h;"circle"===a.nodeName?(g=tc(a,1.5*Pa),h=xc):"rect"===a.nodeName&&(g=uc(a), +h=zc);if(sa||g)ia&&ta(b)&&(f.classed(ja,!e),h(!e,f,b,d)),Fd(b,f)}function Ic(a){if(ia&&(!ra||B.altDomain)){var b=Jb[0],d=Jb[1],f=a[0];a=a[1];var e=Math.min(b,f),g=Math.max(b,f),h=sa?r:Math.min(d,a),m=sa?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ta(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ja),k=d.classed(Kb),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"), +n=1*d.attr("cy"),q=xc,l=e",c,e,g;for(c=0;c"+g+""+e+"";return b+""}),Dd=e(["tooltip","init","show"],!1),Ba=e(["tooltip","init","x"],0),Gc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Db=wa.replace("#","")+"-clip",Ra="url(#"+Db+")",A="timeseries"===Nc,ea="categorized"===Nc,rb=!A&&(qa||X),Jb=null, +Sa=!1,Ib=!1,ma=Aa?40:0,Y=function(a,b){var c=[],e=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===c.indexOf(b)&&c.push(b);return e[c.indexOf(b)%e.length]}}(Ld,Md),Wc=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"),function(a){return a.getDay()&& +1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}],[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Pb,Wb,Rb,Za,Vb,Xb,q,p,na,mb,va,Zb,$b,pb,qb,m,u,V,da,$a,ab,z,oa,bb,Fa,Rc=g?"left":"bottom",Sc=g?ob?"top":"bottom":ob?"right":"left",Tc=g?nb?"bottom":"top":nb?"left": +"right",Uc="bottom",J={main:function(){return"translate("+y+","+r+")"},context:function(){return"translate("+l+","+Ca+")"},legend:function(){return"translate("+Nb+","+Mb+")"},y2:function(){return"translate("+(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+na+")"}},Hd=function(){var a=c.svg.line().x(g?function(a){return E(a.id)(a.value)}:gb).y(g?gb:function(a){return E(a.id)(a.value)});return function(b){var c=Ac(b.values),e;if(wb(b))return"spline"=== +ha["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Mc[b.id]?qd(c,m,E(b.id),Mc[b.id]):a(c);e=m(c[0].x);b=E(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Id=function(){var a=c.svg.line().x(function(a){return da(a.x)}).y(function(a){return T(a.id)(a.value)});return function(b){var c=Ac(b.values);return wb(b)?a(c):"M "+da(c[0].x)+" "+T(b.id)(c[0].value)}}(),G=c.svg.brush().on("brush",function(){C({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}), +B=c.behavior.zoom().on("zoomstart",function(){B.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Jd:null);G.update=function(){v&&v.select(".x.brush").call(this);return this};B.orgScaleExtent=function(){var a=Lc?Lc:[1,10];return[a[0],Math.max(Na()/a[1],a[1])]};B.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(W[1]-W[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Qa,ib,k,v,za,P,hb,xa=null,Ma=null,W;h.focus=function(a){h.defocus(); +c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Va(a)).transition().style("opacity",1)};h.hide=function(a){c.selectAll(Va(a)).transition().style("opacity", +0)};h.unzoom=function(){G.clear().update();C({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&ea&&(Ga=a.categories,z.categories(Ga));if("cacheIds"in a&&Wa(a.cacheIds))Ta(Xa(a.cacheIds),a.done);else if("data"in a)Ta(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Ta(La(c),a.done)});else if("rows"in a)Ta(La(dc(a.rows)),a.done);else if("columns"in a)Ta(La(ec(a.columns)),a.done);else throw Error("url or rows or columns is required.");};h.unload= +function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Aa&&(c.selectAll(".legend-item-"+a).remove(),kb(h.data.targets));0b.classes.indexOf(a)})});return K}; +h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b=db(function(b){return b.id===a});return 0 Date: Mon, 3 Feb 2014 20:01:41 +0900 Subject: [PATCH 20/31] Fix y tick format option --- c3.js | 8 ++++---- c3.min.js | 32 ++++++++++++++++---------------- 2 files changed, 20 insertions(+), 20 deletions(-) diff --git a/c3.js b/c3.js index 696cb47..8239718 100644 --- a/c3.js +++ b/c3.js @@ -88,7 +88,7 @@ // not used //__axis_y_rescale = getConfig(['axis', 'y', 'rescale'], true), __axis_y_inner = getConfig(['axis', 'y', 'inner'], false), - __axis_y_format = getConfig(['axis', 'y', 'format'], function (d) { return d; }), + __axis_y_tick_format = getConfig(['axis', 'y', 'tick', 'format'], function (d) { return d; }), __axis_y_padding = getConfig(['axis', 'y', 'padding'], null), __axis_y_ticks = getConfig(['axis', 'y', 'ticks'], 10), __axis_y2_show = getConfig(['axis', 'y2', 'show'], false), @@ -99,7 +99,7 @@ // __axis_y2_label = getConfig(['axis', 'y2', 'text'], null), // __axis_y2_rescale = getConfig(['axis', 'y2', 'rescale'], true), __axis_y2_inner = getConfig(['axis', 'y2', 'inner'], false), - __axis_y2_format = getConfig(['axis', 'y2', 'format'], function (d) { return d; }), + __axis_y2_tick_format = getConfig(['axis', 'y2', 'tick', 'format'], function (d) { return d; }), __axis_y2_padding = getConfig(['axis', 'y2', 'padding'], null), __axis_y2_ticks = getConfig(['axis', 'y2', 'ticks'], 10), __axis_rotated = getConfig(['axis', 'rotated'], false); @@ -1082,8 +1082,8 @@ // Set axes attrs xAxis.ticks(data.length < 10 ? data.length : 10); - yAxis.ticks(__axis_y_ticks).outerTickSize(0).tickFormat(__axis_y_format); - yAxis2.ticks(__axis_y2_ticks).outerTickSize(0).tickFormat(__axis_y2_format); + yAxis.ticks(__axis_y_ticks).outerTickSize(0).tickFormat(__axis_y_tick_format); + yAxis2.ticks(__axis_y2_ticks).outerTickSize(0).tickFormat(__axis_y2_tick_format); // Save original x domain for zoom update orgXDomain = x.domain(); diff --git a/c3.min.js b/c3.min.js index 98f4b28..33889af 100644 --- a/c3.min.js +++ b/c3.min.js @@ -55,19 +55,19 @@ a}).transition().duration(100).style("opacity",0.3);h.focus(a)}).on("mouseout",f 10);e.append("text").text(function(a){return n(Ka[a])?Ka[a]:a}).attr("x",-200).attr("y",function(){return ma/2});za.selectAll("rect.legend-item-event").data(d).transition().duration(k?250:0).attr("x",function(a,b){return g+Ua*b});za.selectAll("rect.legend-item-tile").data(d).transition().duration(k?250:0).attr("x",function(a,b){return g+Ua*b});za.selectAll("text").data(d).transition().duration(k?250:0).attr("x",function(a,b){return g+Ua*b+14})}function Va(a){return n(a)?".target-"+a:".target"}var h= {data:{}},eb={},Z="_expanded_",ja="_selected_",Kb="_included_",wa=e(["bindto"],"#chart"),Ya=e(["size","width"],null),Yb=e(["size","height"],null),Ub=e(["padding","left"],null),Sb=e(["padding","right"],null),ra=e(["zoom","enabled"],!1),Lc=e(["zoom","extent"],null),Cd=e(["zoom","privileged"],!1),vd=e(["onenter"],function(){}),wd=e(["onleave"],function(){});if(!("data"in $))throw Error("data is required in config");var qa=e(["data","x"],null),X=e(["data","xs"],null),xb=e(["data","x_format"],"%Y-%m-%d"), gd=e(["data","id_converter"],function(a){return a}),Ka=e(["data","names"],{}),t=e(["data","groups"],[]),ac=e(["data","axes"],{}),ha=e(["data","types"],{}),Mc=e(["data","regions"],{}),Ld=e(["data","colors"],{}),ia=e(["data","selection","enabled"],!1),sa=e(["data","selection","grouped"],!1),ta=e(["data","selection","isselectable"],function(){return!0}),ya=e(["subchart","show"],!1),Qb=ya?e(["subchart","size","height"],60):0,Md=e(["color","pattern"],null),Aa=e(["legend","show"],!0),Ua=e(["legend","item", -"width"],80),Kd=e(["legend","item","onclick"],function(){}),Nc=e(["axis","x","type"],"indexed"),Ga=e(["axis","x","categories"],[]),Vc=e(["axis","x","tick","centered"],!1),cb=e(["axis","x","tick","format"],null),jb=e(["axis","x","default"],null),xd=e(["axis","x","label"],null),ad=e(["axis","y","max"],null),Zc=e(["axis","y","min"],null),cd=e(["axis","y","center"],null),yd=e(["axis","y","label"],null),ob=e(["axis","y","inner"],!1),sd=e(["axis","y","format"],function(a){return a}),Ia=e(["axis","y","padding"], -null),rd=e(["axis","y","ticks"],10),Tb=e(["axis","y2","show"],!1),$c=e(["axis","y2","max"],null),Yc=e(["axis","y2","min"],null),bd=e(["axis","y2","center"],null),nb=e(["axis","y2","inner"],!1),ud=e(["axis","y2","format"],function(a){return a}),Ja=e(["axis","y2","padding"],null),td=e(["axis","y2","ticks"],10),g=e(["axis","rotated"],!1),Dc=e(["grid","x","show"],!1),Gd=e(["grid","x","type"],"tick"),Eb=e(["grid","x","lines"],null),Ec=e(["grid","y","show"],!1),Fb=e(["grid","y","lines"],null),Bb=e(["point", -"show"],!0)?e(["point","r"],2.5):0,zd=e(["point","focus","line","enabled"],!0),Gb=e(["point","focus","expand","enabled"],!0),Hb=e(["point","focus","expand","r"],Gb?4:Bb),Pa=e(["point","focus","select","r"],8),Fd=e(["point","onclick"],function(){}),nd=e(["point","onselected"],function(){}),od=e(["point","onunselected"],function(){}),K=e(["regions"],[]),mc=e(["tooltip","contents"],function(a){var b="",c,e,g;for(c=0;c";return b+"
"+I()(a[0].x)+"
"+g+""+e+"
"}),Dd=e(["tooltip","init","show"],!1),Ba=e(["tooltip","init","x"],0),Gc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Db=wa.replace("#","")+"-clip",Ra="url(#"+Db+")",A="timeseries"===Nc,ea="categorized"===Nc,rb=!A&&(qa||X),Jb=null, -Sa=!1,Ib=!1,ma=Aa?40:0,Y=function(a,b){var c=[],e=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===c.indexOf(b)&&c.push(b);return e[c.indexOf(b)%e.length]}}(Ld,Md),Wc=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"),function(a){return a.getDay()&& -1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}],[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Pb,Wb,Rb,Za,Vb,Xb,q,p,na,mb,va,Zb,$b,pb,qb,m,u,V,da,$a,ab,z,oa,bb,Fa,Rc=g?"left":"bottom",Sc=g?ob?"top":"bottom":ob?"right":"left",Tc=g?nb?"bottom":"top":nb?"left": -"right",Uc="bottom",J={main:function(){return"translate("+y+","+r+")"},context:function(){return"translate("+l+","+Ca+")"},legend:function(){return"translate("+Nb+","+Mb+")"},y2:function(){return"translate("+(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+na+")"}},Hd=function(){var a=c.svg.line().x(g?function(a){return E(a.id)(a.value)}:gb).y(g?gb:function(a){return E(a.id)(a.value)});return function(b){var c=Ac(b.values),e;if(wb(b))return"spline"=== -ha["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Mc[b.id]?qd(c,m,E(b.id),Mc[b.id]):a(c);e=m(c[0].x);b=E(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Id=function(){var a=c.svg.line().x(function(a){return da(a.x)}).y(function(a){return T(a.id)(a.value)});return function(b){var c=Ac(b.values);return wb(b)?a(c):"M "+da(c[0].x)+" "+T(b.id)(c[0].value)}}(),G=c.svg.brush().on("brush",function(){C({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}), -B=c.behavior.zoom().on("zoomstart",function(){B.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Jd:null);G.update=function(){v&&v.select(".x.brush").call(this);return this};B.orgScaleExtent=function(){var a=Lc?Lc:[1,10];return[a[0],Math.max(Na()/a[1],a[1])]};B.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(W[1]-W[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Qa,ib,k,v,za,P,hb,xa=null,Ma=null,W;h.focus=function(a){h.defocus(); -c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Va(a)).transition().style("opacity",1)};h.hide=function(a){c.selectAll(Va(a)).transition().style("opacity", -0)};h.unzoom=function(){G.clear().update();C({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&ea&&(Ga=a.categories,z.categories(Ga));if("cacheIds"in a&&Wa(a.cacheIds))Ta(Xa(a.cacheIds),a.done);else if("data"in a)Ta(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Ta(La(c),a.done)});else if("rows"in a)Ta(La(dc(a.rows)),a.done);else if("columns"in a)Ta(La(ec(a.columns)),a.done);else throw Error("url or rows or columns is required.");};h.unload= -function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Aa&&(c.selectAll(".legend-item-"+a).remove(),kb(h.data.targets));0b.classes.indexOf(a)})});return K}; -h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b=db(function(b){return b.id===a});return 0",c,e,g;for(c= +0;c"+g+""+e+"";return b+""}),Dd=e(["tooltip","init","show"],!1),Ba=e(["tooltip","init","x"],0),Gc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Db=wa.replace("#","")+"-clip",Ra="url(#"+Db+")",A="timeseries"===Nc,ea="categorized"=== +Nc,rb=!A&&(qa||X),Jb=null,Sa=!1,Ib=!1,ma=Aa?40:0,Y=function(a,b){var c=[],e=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===c.indexOf(b)&&c.push(b);return e[c.indexOf(b)%e.length]}}(Ld,Md),Wc=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"), +function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}],[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Pb,Wb,Rb,Za,Vb,Xb,q,p,na,mb,va,Zb,$b,pb,qb,m,u,V,da,$a,ab,z,oa,bb,Fa,Rc=g?"left":"bottom",Sc=g?ob?"top":"bottom":ob?"right":"left", +Tc=g?nb?"bottom":"top":nb?"left":"right",Uc="bottom",J={main:function(){return"translate("+y+","+r+")"},context:function(){return"translate("+l+","+Ca+")"},legend:function(){return"translate("+Nb+","+Mb+")"},y2:function(){return"translate("+(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+na+")"}},Hd=function(){var a=c.svg.line().x(g?function(a){return E(a.id)(a.value)}:gb).y(g?gb:function(a){return E(a.id)(a.value)});return function(b){var c= +Ac(b.values),e;if(wb(b))return"spline"===ha["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Mc[b.id]?qd(c,m,E(b.id),Mc[b.id]):a(c);e=m(c[0].x);b=E(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Id=function(){var a=c.svg.line().x(function(a){return da(a.x)}).y(function(a){return T(a.id)(a.value)});return function(b){var c=Ac(b.values);return wb(b)?a(c):"M "+da(c[0].x)+" "+T(b.id)(c[0].value)}}(),G=c.svg.brush().on("brush",function(){C({withTransition:!1,withY:!1, +withSubchart:!1,withUpdateXDomain:!0})}),B=c.behavior.zoom().on("zoomstart",function(){B.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Jd:null);G.update=function(){v&&v.select(".x.brush").call(this);return this};B.orgScaleExtent=function(){var a=Lc?Lc:[1,10];return[a[0],Math.max(Na()/a[1],a[1])]};B.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(W[1]-W[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Qa,ib,k,v,za,P,hb,xa=null, +Ma=null,W;h.focus=function(a){h.defocus();c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Va(a)).transition().style("opacity", +1)};h.hide=function(a){c.selectAll(Va(a)).transition().style("opacity",0)};h.unzoom=function(){G.clear().update();C({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&ea&&(Ga=a.categories,z.categories(Ga));if("cacheIds"in a&&Wa(a.cacheIds))Ta(Xa(a.cacheIds),a.done);else if("data"in a)Ta(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Ta(La(c),a.done)});else if("rows"in a)Ta(La(dc(a.rows)),a.done);else if("columns"in a)Ta(La(ec(a.columns)), +a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Aa&&(c.selectAll(".legend-item-"+a).remove(),kb(h.data.targets));0b.classes.indexOf(a)})});return K};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b=db(function(b){return b.id===a});return 0 Date: Tue, 4 Feb 2014 19:12:11 +0900 Subject: [PATCH 21/31] Add scatter plot type --- c3.js | 52 +++++++++++++++++-- c3.min.js | 146 +++++++++++++++++++++++++++--------------------------- 2 files changed, 120 insertions(+), 78 deletions(-) diff --git a/c3.js b/c3.js index 8239718..1618838 100644 --- a/c3.js +++ b/c3.js @@ -419,6 +419,10 @@ } return (domain[1] - domain[0]) / (extent[1] - extent[0]); } + function getDefaultXDomain() { + var padding = isCategorized ? 0 : Math.abs(lastX - firstX) * 0.01; + return [firstX - padding, lastX + padding]; + } function diffDomain(d) { return d[1] - d[0]; } @@ -540,11 +544,27 @@ d.x = x; // used by event-rect - return {x: x, value: d[id] !== null && !isNaN(d[id]) ? +d[id] : null, id: convertedId, index: i}; + return {x: x, value: d[id] !== null && !isNaN(d[id]) ? +d[id] : null, id: convertedId}; }) }; }); + // finish targets + targets.forEach(function (t) { + var i; + // sort values by its x + t.values = t.values.sort(function (v1, v2) { + var x1 = v1.x || v1.x === 0 ? v1.x : Infinity, + x2 = v2.x || v2.x === 0 ? v2.x : Infinity; + return x1 - x2; + }); + // indexing each value + i = 0; + t.values.forEach(function (v) { + v.index = i++; + }); + }); + // cache as original id keyed targets.forEach(function (d) { addCache(d.id_org, d); @@ -678,6 +698,8 @@ } function showXGridFocus(data) { + // Show when line chart exists + if (! hasLineType(c3.data.targets)) { return; } main.selectAll('line.xgrid-focus') .style("visibility", "visible") .data([data]) @@ -771,14 +793,17 @@ }); return has; } - /* not used function hasLineType(targets) { return hasType(targets, 'line'); } - */ function hasBarType(targets) { return hasType(targets, 'bar'); } + /* not used + function hasScatterType(targets) { + return hasType(targets, 'scatter'); + } + */ function isLineType(d) { var id = (typeof d === 'string') ? d : d.id; return !(id in __data_types) || __data_types[id] === 'line' || __data_types[id] === 'spline'; @@ -791,12 +816,24 @@ var id = (typeof d === 'string') ? d : d.id; return __data_types[id] === 'bar'; } + function isScatterType(d) { + var id = (typeof d === 'string') ? d : d.id; + return __data_types[id] === 'scatter'; + } + /* not used function lineData(d) { return isLineType(d) ? d.values : []; } + function scatterData(d) { + return isScatterType(d) ? d.values : []; + } + */ function barData(d) { return isBarType(d) ? d.values : []; } + function lineOrScatterData(d) { + return isLineType(d) || isScatterType(d) ? d.values : []; + } //-- Color --// @@ -1073,7 +1110,7 @@ updateScales(); // Set domains for each scale - x.domain(d3.extent([firstX, lastX])); + x.domain(d3.extent(getDefaultXDomain())); y.domain(getYDomain('y')); y2.domain(getYDomain('y2')); subX.domain(x.domain()); @@ -1698,7 +1735,7 @@ .transition().duration(duration) .attr("d", lineOnMain); mainCircle = main.selectAll('.-circles').selectAll('.-circle') - .data(lineData); + .data(lineOrScatterData); mainCircle.transition().duration(duration) .style('opacity', function (d) { return d.value === null ? 0 : 1; }) .attr("cx", __axis_rotated ? circleY : circleX) @@ -2186,6 +2223,11 @@ redraw(); }; + c3.toScatter = function (targets) { + setTargetType(targets, 'scatter'); + redraw(); + }; + c3.groups = function (groups) { if (isUndefined(groups)) { return __data_groups; } __data_groups = groups; diff --git a/c3.min.js b/c3.min.js index 33889af..e15fe2e 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,73 +1,73 @@ -(function(Q){function Oc(){function n(c,e){c.attr("transform",function(c){return"translate("+(e(c)+aa)+", 0)"})}function s(c,e){c.attr("transform",function(c){return"translate(0,"+e(c)+")"})}function Q(c){var e=c[0];c=c[c.length-1];return ea?0:a}function cc(a){return qa&&a===qa||X&&ed(X,a)}function fd(a){return!cc(a)}function fb(a){var b=Ka[a.id];a.name=n(b)?b:a.id;return a}function dc(a){var b=a[0],d={},f=[],c,e;for(c=1;ct[d].indexOf(c.id)))for(f=0;fb?a-b:0};return function(a){var c=b?T(a.id):E(a.id);return d(c(a.value))}}function vb(a,b){var d=s(a)?sb():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+=r)h+=f(a[c-1],a[c],e,l)}return h}function Cb(a){var b,d;hb=c.select(wa);if(hb.empty())Q.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{hb.html("");h.data.x={};h.data.targets=La(a);ua();Lb();m.domain(c.extent([xa, -Ma]));u.domain(la("y"));V.domain(la("y2"));da.domain(m.domain());$a.domain(u.domain());ab.domain(V.domain());z.ticks(10>a.length?a.length:10);oa.ticks(rd).outerTickSize(0).tickFormat(sd);bb.ticks(td).outerTickSize(0).tickFormat(ud);W=m.domain();G.x(da);ra&&B.x(m);Qa=c.select(wa).append("svg").attr("width",q+y+ca).attr("height",p+r+F).on("mouseenter",vd).on("mouseleave",wd);ib=Qa.append("defs");ib.append("clipPath").attr("id",Db).append("rect").attr("y",r).attr("width",q).attr("height",p-r);ib.append("clipPath").attr("id", -"xaxis-clip").append("rect").attr("x",-1-y).attr("y",-20).attr("width",S).attr("height",R);ib.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-y+1).attr("y",r-1).attr("width",ka).attr("height",lb);k=Qa.append("g").attr("transform",J.main);v=ya?Qa.append("g").attr("transform",J.context):null;za=Aa?Qa.append("g").attr("transform",J.legend):null;P=c.select(wa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class", -"x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",J.x).call(g?oa:z).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(xd);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?z:oa).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(yd);Tb&&k.append("g").attr("class","y2 axis").attr("transform",J.y2).call(bb);b=k.append("g").attr("clip-path", -Ra).attr("class","grid");Dc&&b.append("g").attr("class","xgrids");Eb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Eb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g?0:-r).attr("dy",-6).text(function(a){return a.text}));zd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class", -"xgrid-focus").attr("x1",g?0:-10).attr("x2",g?q:-10).attr("y1",g?-10:r).attr("y2",g?-10:p);Ec&&b.append("g").attr("class","ygrids");Fb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Fb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Ra).attr("class","regions");k.append("g").attr("clip-path",Ra).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor", -ra?"ew-resize":null);X?Ad(b):Bd(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(ra)k.insert("rect",Cd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(B).on("dblclick.zoom",null);null!==jb&&G.extent("function"!==typeof jb?jb:jb(xa,Ma));ya&&(v.append("g").attr("clip-path",Ra).attr("class","chart"),v.select(".chart").append("g").attr("class","chart-bars"), -v.select(".chart").append("g").attr("class","chart-lines"),v.append("g").attr("clip-path",Ra).attr("class","x brush").call(G).selectAll("rect").attr("height",na),v.append("g").attr("class","x axis").attr("transform",J.subx).call(Fa));Aa&&kb(h.data.targets);Fc(h.data.targets);C({withTransition:!1,withUpdateXDomain:!0});if(Dd){if(A&&"string"===typeof Ba){Ba=pa(Ba);for(a=0;avc(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor", -null))}).on("click",function(){var a=c.mouse(this),d=kc(h.data.targets,a);100>vc(d,a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Hc(this,d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Ic(c.mouse(this))}).on("dragstart",function(){Jc(c.mouse(this))}).on("dragend",function(){Kc()})).call(B).on("dblclick.zoom",null)}function Hc(a,b,d){var f=c.select(a),e=f.classed(ja),g=!1,h;"circle"===a.nodeName?(g=tc(a,1.5*Pa),h=xc):"rect"===a.nodeName&&(g=uc(a), -h=zc);if(sa||g)ia&&ta(b)&&(f.classed(ja,!e),h(!e,f,b,d)),Fd(b,f)}function Ic(a){if(ia&&(!ra||B.altDomain)){var b=Jb[0],d=Jb[1],f=a[0];a=a[1];var e=Math.min(b,f),g=Math.max(b,f),h=sa?r:Math.min(d,a),m=sa?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ta(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ja),k=d.classed(Kb),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"), -n=1*d.attr("cy"),q=xc,l=e",c,e,g;for(c= -0;c"+g+""+e+"";return b+""}),Dd=e(["tooltip","init","show"],!1),Ba=e(["tooltip","init","x"],0),Gc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Db=wa.replace("#","")+"-clip",Ra="url(#"+Db+")",A="timeseries"===Nc,ea="categorized"=== -Nc,rb=!A&&(qa||X),Jb=null,Sa=!1,Ib=!1,ma=Aa?40:0,Y=function(a,b){var c=[],e=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===c.indexOf(b)&&c.push(b);return e[c.indexOf(b)%e.length]}}(Ld,Md),Wc=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"), -function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}],[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Pb,Wb,Rb,Za,Vb,Xb,q,p,na,mb,va,Zb,$b,pb,qb,m,u,V,da,$a,ab,z,oa,bb,Fa,Rc=g?"left":"bottom",Sc=g?ob?"top":"bottom":ob?"right":"left", -Tc=g?nb?"bottom":"top":nb?"left":"right",Uc="bottom",J={main:function(){return"translate("+y+","+r+")"},context:function(){return"translate("+l+","+Ca+")"},legend:function(){return"translate("+Nb+","+Mb+")"},y2:function(){return"translate("+(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+na+")"}},Hd=function(){var a=c.svg.line().x(g?function(a){return E(a.id)(a.value)}:gb).y(g?gb:function(a){return E(a.id)(a.value)});return function(b){var c= -Ac(b.values),e;if(wb(b))return"spline"===ha["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Mc[b.id]?qd(c,m,E(b.id),Mc[b.id]):a(c);e=m(c[0].x);b=E(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Id=function(){var a=c.svg.line().x(function(a){return da(a.x)}).y(function(a){return T(a.id)(a.value)});return function(b){var c=Ac(b.values);return wb(b)?a(c):"M "+da(c[0].x)+" "+T(b.id)(c[0].value)}}(),G=c.svg.brush().on("brush",function(){C({withTransition:!1,withY:!1, -withSubchart:!1,withUpdateXDomain:!0})}),B=c.behavior.zoom().on("zoomstart",function(){B.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Jd:null);G.update=function(){v&&v.select(".x.brush").call(this);return this};B.orgScaleExtent=function(){var a=Lc?Lc:[1,10];return[a[0],Math.max(Na()/a[1],a[1])]};B.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(W[1]-W[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Qa,ib,k,v,za,P,hb,xa=null, -Ma=null,W;h.focus=function(a){h.defocus();c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Va(a)).filter(function(a){return tb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Va(a)).transition().style("opacity", -1)};h.hide=function(a){c.selectAll(Va(a)).transition().style("opacity",0)};h.unzoom=function(){G.clear().update();C({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&ea&&(Ga=a.categories,z.categories(Ga));if("cacheIds"in a&&Wa(a.cacheIds))Ta(Xa(a.cacheIds),a.done);else if("data"in a)Ta(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Ta(La(c),a.done)});else if("rows"in a)Ta(La(dc(a.rows)),a.done);else if("columns"in a)Ta(La(ec(a.columns)), -a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Aa&&(c.selectAll(".legend-item-"+a).remove(),kb(h.data.targets));0b.classes.indexOf(a)})});return K};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b=db(function(b){return b.id===a});return 0a?0:a}function ec(a){return ra&&a===ra||Y&&fd(Y,a)}function gd(a){return!ec(a)}function eb(a){var b=Ka[a.id];a.name=n(b)?b:a.id;return a}function fc(a){var b=a[0],d={},f=[],c,H;for(c=1;ct[d].indexOf(c.id)))for(f=0;fb?a-b:0};return function(a){var c=b?T(a.id):F(a.id);return d(c(a.value))}} +function gb(a,b){var d=s(a)?ub():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+= +r)h+=f(a[c-1],a[c],e,l)}return h}function Db(a){var b,d;hb=c.select(xa);if(hb.empty())Q.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{hb.html("");h.data.x={};h.data.targets=La(a);va();Mb();m.domain(c.extent(Va()));u.domain(la("y"));V.domain(la("y2"));fa.domain(m.domain());Za.domain(u.domain());$a.domain(V.domain());B.ticks(10>a.length?a.length:10);oa.ticks(sd).outerTickSize(0).tickFormat(td);ab.ticks(ud).outerTickSize(0).tickFormat(vd); +W=m.domain();I.x(fa);sa&&D.x(m);Pa=c.select(xa).append("svg").attr("width",q+A+ea).attr("height",p+r+G).on("mouseenter",wd).on("mouseleave",xd);ib=Pa.append("defs");ib.append("clipPath").attr("id",Eb).append("rect").attr("y",r).attr("width",q).attr("height",p-r);ib.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",S).attr("height",R);ib.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",r-1).attr("width",ka).attr("height", +nb);k=Pa.append("g").attr("transform",L.main);w=za?Pa.append("g").attr("transform",L.context):null;Aa=Ba?Pa.append("g").attr("transform",L.legend):null;P=c.select(xa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",L.x).call(g?oa:B).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(yd); +k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?B:oa).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(zd);Tb&&k.append("g").attr("class","y2 axis").attr("transform",L.y2).call(ab);b=k.append("g").attr("clip-path",Qa).attr("class","grid");Fc&&b.append("g").attr("class","xgrids");Fb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Fb).enter().append("g").attr("class", +"xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g?0:-r).attr("dy",-6).text(function(a){return a.text}));Ad&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2",g?q:-10).attr("y1",g?-10:r).attr("y2",g?-10:p);Gc&&b.append("g").attr("class","ygrids");Gb&&b.append("g").attr("class", +"ygrid-lines").selectAll("ygrid-line").data(Gb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Qa).attr("class","regions");k.append("g").attr("clip-path",Qa).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",sa?"ew-resize":null);Y?Bd(b):Cd(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(sa)k.insert("rect", +Dd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(D).on("dblclick.zoom",null);null!==jb&&I.extent("function"!==typeof jb?jb:jb(pa,ya));za&&(w.append("g").attr("clip-path",Qa).attr("class","chart"),w.select(".chart").append("g").attr("class","chart-bars"),w.select(".chart").append("g").attr("class","chart-lines"),w.append("g").attr("clip-path",Qa).attr("class","x brush").call(I).selectAll("rect").attr("height",na),w.append("g").attr("class", +"x axis").attr("transform",L.subx).call(Fa));Ba&&kb(h.data.targets);Hc(h.data.targets);z({withTransition:!1,withUpdateXDomain:!0});if(Ed){if(C&&"string"===typeof Ca){Ca=qa(Ca);for(a=0;axc(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor",null))}).on("click",function(){var a=c.mouse(this),d=mc(h.data.targets,a);100>xc(d,a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Jc(this, +d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Kc(c.mouse(this))}).on("dragstart",function(){Lc(c.mouse(this))}).on("dragend",function(){Mc()})).call(D).on("dblclick.zoom",null)}function Jc(a,b,d){var f=c.select(a),e=f.classed(ja),g=!1,h;"circle"===a.nodeName?(g=vc(a,1.5*Oa),h=zc):"rect"===a.nodeName&&(g=wc(a),h=Bc);if(ta||g)ia&&ua(b)&&(f.classed(ja,!e),h(!e,f,b,d)),Gd(b,f)}function Kc(a){if(ia&&(!sa||D.altDomain)){var b=Kb[0],d=Kb[1],f=a[0];a=a[1];var e=Math.min(b,f),g= +Math.max(b,f),h=ta?r:Math.min(d,a),m=ta?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ua(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ja),k=d.classed(Lb),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"),n=1*d.attr("cy"),q=zc,l=e",d,c,e;for(d=0;d"+e+""+c+"";return b+""}),Ed=e(["tooltip","init","show"],!1),Ca=e(["tooltip","init","x"],0),Ic=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Eb=xa.replace("#","")+"-clip",Qa="url(#"+Eb+")",C="timeseries"===Pc,X="categorized"===Pc,tb=!C&&(ra||Y),Kb=null,Ra=!1,Jb=!1,ma=Ba?40:0,$=function(a,b){var c=[],e=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in +a)return a[b];-1===c.indexOf(b)&&c.push(b);return e[c.indexOf(b)%e.length]}}(Md,Nd),Yc=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}], +[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Pb,Wb,Rb,Ya,Vb,Xb,q,p,na,ob,wa,Zb,$b,rb,sb,m,u,V,fa,Za,$a,B,oa,ab,Fa,Tc=g?"left":"bottom",Uc=g?qb?"top":"bottom":qb?"right":"left",Vc=g?pb?"bottom":"top":pb?"left":"right",Wc="bottom",L={main:function(){return"translate("+A+","+r+")"},context:function(){return"translate("+l+","+Da+")"},legend:function(){return"translate("+Ob+","+Nb+")"},y2:function(){return"translate("+ +(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+na+")"}},Id=function(){var a=c.svg.line().x(g?function(a){return F(a.id)(a.value)}:fb).y(g?fb:function(a){return F(a.id)(a.value)});return function(b){var c=Cc(b.values),e;if(xb(b))return"spline"===Z["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Oc[b.id]?rd(c,m,F(b.id),Oc[b.id]):a(c);e=m(c[0].x);b=F(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Jd=function(){var a= +c.svg.line().x(function(a){return fa(a.x)}).y(function(a){return T(a.id)(a.value)});return function(b){var c=Cc(b.values);return xb(b)?a(c):"M "+fa(c[0].x)+" "+T(b.id)(c[0].value)}}(),I=c.svg.brush().on("brush",function(){z({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}),D=c.behavior.zoom().on("zoomstart",function(){D.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",sa?Kd:null);I.update=function(){w&&w.select(".x.brush").call(this);return this};D.orgScaleExtent= +function(){var a=Nc?Nc:[1,10];return[a[0],Math.max(Ma()/a[1],a[1])]};D.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(W[1]-W[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Pa,ib,k,w,Aa,P,hb,pa=null,ya=null,W;h.focus=function(a){h.defocus();c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused", +!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Ua(a)).transition().style("opacity",1)};h.hide=function(a){c.selectAll(Ua(a)).transition().style("opacity",0)};h.unzoom=function(){I.clear().update();z({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&X&&(Ga=a.categories,B.categories(Ga)); +if("cacheIds"in a&&Wa(a.cacheIds))Sa(mb(a.cacheIds),a.done);else if("data"in a)Sa(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Sa(La(c),a.done)});else if("rows"in a)Sa(La(fc(a.rows)),a.done);else if("columns"in a)Sa(La(gc(a.columns)),a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Ba&&(c.selectAll(".legend-item-"+ +a).remove(),kb(h.data.targets));0b.classes.indexOf(a)})});return M};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}): +void 0};h.data.getAsTarget=function(a){var b=cb(function(b){return b.id===a});return 0 Date: Tue, 4 Feb 2014 19:20:27 +0900 Subject: [PATCH 22/31] Fix NaN when undefined x for bar chart --- c3.js | 3 ++- c3.min.js | 22 +++++++++++----------- 2 files changed, 13 insertions(+), 12 deletions(-) diff --git a/c3.js b/c3.js index 1618838..d545751 100644 --- a/c3.js +++ b/c3.js @@ -740,9 +740,10 @@ } function getBarX(barW, barTargetsNum, barIndices, isSub) { var scale = isSub ? subX : x; + if (! barTargetsNum) { return function () { return 0; }; } return function (d) { var barIndex = d.id in barIndices ? barIndices[d.id] : 0; - return scale(d.x) - barW * (barTargetsNum / 2 - barIndex); + return d.x || d.x === 0 ? scale(d.x) - barW * (barTargetsNum / 2 - barIndex) : 0; }; } function getBarY(barH, barIndices, zeroBased, isSub) { diff --git a/c3.min.js b/c3.min.js index e15fe2e..0b0ee26 100644 --- a/c3.min.js +++ b/c3.min.js @@ -16,17 +16,17 @@ function vb(a){var b=ub(),d;for(d=0;dt[d].indexOf(c.id)))for(f=0;fb?a-b:0};return function(a){var c=b?T(a.id):F(a.id);return d(c(a.value))}} -function gb(a,b){var d=s(a)?ub():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+= -r)h+=f(a[c-1],a[c],e,l)}return h}function Db(a){var b,d;hb=c.select(xa);if(hb.empty())Q.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{hb.html("");h.data.x={};h.data.targets=La(a);va();Mb();m.domain(c.extent(Va()));u.domain(la("y"));V.domain(la("y2"));fa.domain(m.domain());Za.domain(u.domain());$a.domain(V.domain());B.ticks(10>a.length?a.length:10);oa.ticks(sd).outerTickSize(0).tickFormat(td);ab.ticks(ud).outerTickSize(0).tickFormat(vd); -W=m.domain();I.x(fa);sa&&D.x(m);Pa=c.select(xa).append("svg").attr("width",q+A+ea).attr("height",p+r+G).on("mouseenter",wd).on("mouseleave",xd);ib=Pa.append("defs");ib.append("clipPath").attr("id",Eb).append("rect").attr("y",r).attr("width",q).attr("height",p-r);ib.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",S).attr("height",R);ib.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",r-1).attr("width",ka).attr("height", -nb);k=Pa.append("g").attr("transform",L.main);w=za?Pa.append("g").attr("transform",L.context):null;Aa=Ba?Pa.append("g").attr("transform",L.legend):null;P=c.select(xa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",L.x).call(g?oa:B).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(yd); -k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?B:oa).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(zd);Tb&&k.append("g").attr("class","y2 axis").attr("transform",L.y2).call(ab);b=k.append("g").attr("clip-path",Qa).attr("class","grid");Fc&&b.append("g").attr("class","xgrids");Fb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Fb).enter().append("g").attr("class", +(a[c.id]=b++)});a.__max__=b-1;return a}function rc(a,b,d,f){var c=f?fa:m;return b?function(f){var e=f.id in d?d[f.id]:0;return f.x||0===f.x?c(f.x)-a*(b/2-e):0}:function(){return 0}}function sc(a,b,d,f){var c=Object.keys(b);return function(e,g){var h=0,k=f?T(e.id):F(e.id);cb(Ha).forEach(function(d){d.id!==e.id&&b[d.id]===b[e.id]&&c.indexOf(d.id)b?a-b:0};return function(a){var c= +b?T(a.id):F(a.id);return d(c(a.value))}}function gb(a,b){var d=s(a)?ub():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+=r)h+=f(a[c-1],a[c],e,l)}return h}function Db(a){var b,d;hb=c.select(xa);if(hb.empty())Q.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{hb.html("");h.data.x={};h.data.targets=La(a);va();Mb();m.domain(c.extent(Va()));u.domain(la("y"));V.domain(la("y2"));fa.domain(m.domain());Za.domain(u.domain());$a.domain(V.domain());B.ticks(10>a.length?a.length:10);oa.ticks(sd).outerTickSize(0).tickFormat(td); +ab.ticks(ud).outerTickSize(0).tickFormat(vd);W=m.domain();I.x(fa);sa&&D.x(m);Pa=c.select(xa).append("svg").attr("width",q+A+ea).attr("height",p+r+G).on("mouseenter",wd).on("mouseleave",xd);ib=Pa.append("defs");ib.append("clipPath").attr("id",Eb).append("rect").attr("y",r).attr("width",q).attr("height",p-r);ib.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",S).attr("height",R);ib.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x", +-A+1).attr("y",r-1).attr("width",ka).attr("height",nb);k=Pa.append("g").attr("transform",L.main);w=za?Pa.append("g").attr("transform",L.context):null;Aa=Ba?Pa.append("g").attr("transform",L.legend):null;P=c.select(xa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",L.x).call(g?oa:B).append("text").attr("class","-axis-x-label").attr("x", +q).attr("dy","-.5em").style("text-anchor","end").text(yd);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?B:oa).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(zd);Tb&&k.append("g").attr("class","y2 axis").attr("transform",L.y2).call(ab);b=k.append("g").attr("clip-path",Qa).attr("class","grid");Fc&&b.append("g").attr("class","xgrids");Fb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Fb).enter().append("g").attr("class", "xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g?0:-r).attr("dy",-6).text(function(a){return a.text}));Ad&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2",g?q:-10).attr("y1",g?-10:r).attr("y2",g?-10:p);Gc&&b.append("g").attr("class","ygrids");Gb&&b.append("g").attr("class", "ygrid-lines").selectAll("ygrid-line").data(Gb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Qa).attr("class","regions");k.append("g").attr("clip-path",Qa).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",sa?"ew-resize":null);Y?Bd(b):Cd(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(sa)k.insert("rect", Dd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(D).on("dblclick.zoom",null);null!==jb&&I.extent("function"!==typeof jb?jb:jb(pa,ya));za&&(w.append("g").attr("clip-path",Qa).attr("class","chart"),w.select(".chart").append("g").attr("class","chart-bars"),w.select(".chart").append("g").attr("class","chart-lines"),w.append("g").attr("clip-path",Qa).attr("class","x brush").call(I).selectAll("rect").attr("height",na),w.append("g").attr("class", From 31a2a1300f875fde4e978de7c6c49034cd006b71 Mon Sep 17 00:00:00 2001 From: Masayuki Tanaka Date: Thu, 6 Feb 2014 10:25:46 +0900 Subject: [PATCH 23/31] Fix sacatter plot tooltip when same x data exists --- c3.js | 70 +++++++++++++++++--------- c3.min.js | 146 +++++++++++++++++++++++++++--------------------------- 2 files changed, 119 insertions(+), 97 deletions(-) diff --git a/c3.js b/c3.js index d545751..7e01403 100644 --- a/c3.js +++ b/c3.js @@ -628,50 +628,72 @@ return y(d.value); } + function findSameXOfValues(values, index) { + var i, targetX = values[index].x, sames = []; + for (i = index - 1; i >= 0; i--) { + if (targetX !== values[i].x) { break; } + sames.push(values[i]); + } + for (i = index; i < values.length; i++) { + if (targetX !== values[i].x) { break; } + sames.push(values[i]); + } + return sames; + } + function findClosestOfValues(values, pos, _min, _max) { // MEMO: values must be sorted by x var min = _min ? _min : 0, max = _max ? _max : values.length - 1, med = Math.floor((max - min) / 2) + min, value = values[med], diff = x(value.x) - pos[0], - minDist, maxDist; + candidates; - // Update rage for search + // Update range for search diff > 0 ? max = med : min = med; // if candidates are two closest min and max, stop recursive call if ((max - min) === 1) { - if (! values[min].x) { return values[max]; } - if (! values[max].x) { return values[min]; } - minDist = Math.pow(pos[0] - x(values[min].x), 2) + Math.pow(pos[1] - y(values[min].value), 2); - maxDist = Math.pow(pos[0] - x(values[max].x), 2) + Math.pow(pos[1] - y(values[max].value), 2); - return minDist < maxDist ? values[min] : values[max]; + + // Get candidates that has same min and max index + candidates = []; + if (values[min].x) { + candidates = candidates.concat(findSameXOfValues(values, min)); + } + if (values[max].x) { + candidates = candidates.concat(findSameXOfValues(values, max)); + } + + // Determine the closest and return + return findClosest(candidates, pos); } return findClosestOfValues(values, pos, min, max); } - function findClosest(targets, mouse) { - var closest, closests, minDist; + function findClosestFromTargets(targets, pos) { + var candidates; // map to array of closest points of each target - closests = targets.map(function (target) { - return findClosestOfValues(target.values, mouse); + candidates = targets.map(function (target) { + return findClosestOfValues(target.values, pos); }); - // decide closest point - closests.forEach(function (c) { - var dist = Math.pow(x(c.x) - mouse[0], 2) + Math.pow(y(c.value) - mouse[1], 2); - if (dist < minDist || ! minDist) { - minDist = dist; - closest = c; + // decide closest point and return + return findClosest(candidates, pos); + } + function findClosest(values, pos) { + var minDist, closest; + values.forEach(function (v) { + var d = dist(v, pos); + if (d < minDist || ! minDist) { + minDist = d; + closest = v; } }); - - // TODO: multiple closests when each is very close - return closest; } + //-- Tooltip --// function showTooltip(selectedData, mouse) { @@ -894,8 +916,8 @@ return found; } - function dist(data, mouse) { - return Math.pow(x(data.x) - mouse[0], 2) + Math.pow(y(data.value) - mouse[1], 2); + function dist(data, pos) { + return Math.pow(x(data.x) - pos[0], 2) + Math.pow(y(data.value) - pos[1], 2); } //-- Selection --// @@ -1480,7 +1502,7 @@ if (dragging) { return; } // do nothing when dragging mouse = d3.mouse(this); - closest = findClosest(c3.data.targets, mouse); + closest = findClosestFromTargets(c3.data.targets, mouse); // show tooltip when cursor is close to some point selectedData = [addName(closest)]; @@ -1504,7 +1526,7 @@ }) .on('click', function () { var mouse = d3.mouse(this), - closest = findClosest(c3.data.targets, mouse); + closest = findClosestFromTargets(c3.data.targets, mouse); // select if selection enabled if (dist(closest, mouse) < 100) { diff --git a/c3.min.js b/c3.min.js index 0b0ee26..d7fa9dd 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,73 +1,73 @@ -(function(Q){function Qc(){function n(c,e){c.attr("transform",function(c){return"translate("+(e(c)+ca)+", 0)"})}function s(c,e){c.attr("transform",function(c){return"translate(0,"+e(c)+")"})}function Q(c){var e=c[0];c=c[c.length-1];return ea?0:a}function ec(a){return ra&&a===ra||Y&&fd(Y,a)}function gd(a){return!ec(a)}function eb(a){var b=Ka[a.id];a.name=n(b)?b:a.id;return a}function fc(a){var b=a[0],d={},f=[],c,H;for(c=1;ct[d].indexOf(c.id)))for(f=0;fb?a-b:0};return function(a){var c= -b?T(a.id):F(a.id);return d(c(a.value))}}function gb(a,b){var d=s(a)?ub():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+=r)h+=f(a[c-1],a[c],e,l)}return h}function Db(a){var b,d;hb=c.select(xa);if(hb.empty())Q.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{hb.html("");h.data.x={};h.data.targets=La(a);va();Mb();m.domain(c.extent(Va()));u.domain(la("y"));V.domain(la("y2"));fa.domain(m.domain());Za.domain(u.domain());$a.domain(V.domain());B.ticks(10>a.length?a.length:10);oa.ticks(sd).outerTickSize(0).tickFormat(td); -ab.ticks(ud).outerTickSize(0).tickFormat(vd);W=m.domain();I.x(fa);sa&&D.x(m);Pa=c.select(xa).append("svg").attr("width",q+A+ea).attr("height",p+r+G).on("mouseenter",wd).on("mouseleave",xd);ib=Pa.append("defs");ib.append("clipPath").attr("id",Eb).append("rect").attr("y",r).attr("width",q).attr("height",p-r);ib.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",S).attr("height",R);ib.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x", --A+1).attr("y",r-1).attr("width",ka).attr("height",nb);k=Pa.append("g").attr("transform",L.main);w=za?Pa.append("g").attr("transform",L.context):null;Aa=Ba?Pa.append("g").attr("transform",L.legend):null;P=c.select(xa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",L.x).call(g?oa:B).append("text").attr("class","-axis-x-label").attr("x", -q).attr("dy","-.5em").style("text-anchor","end").text(yd);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?B:oa).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(zd);Tb&&k.append("g").attr("class","y2 axis").attr("transform",L.y2).call(ab);b=k.append("g").attr("clip-path",Qa).attr("class","grid");Fc&&b.append("g").attr("class","xgrids");Fb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Fb).enter().append("g").attr("class", -"xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g?0:-r).attr("dy",-6).text(function(a){return a.text}));Ad&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2",g?q:-10).attr("y1",g?-10:r).attr("y2",g?-10:p);Gc&&b.append("g").attr("class","ygrids");Gb&&b.append("g").attr("class", -"ygrid-lines").selectAll("ygrid-line").data(Gb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Qa).attr("class","regions");k.append("g").attr("clip-path",Qa).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",sa?"ew-resize":null);Y?Bd(b):Cd(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(sa)k.insert("rect", -Dd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(D).on("dblclick.zoom",null);null!==jb&&I.extent("function"!==typeof jb?jb:jb(pa,ya));za&&(w.append("g").attr("clip-path",Qa).attr("class","chart"),w.select(".chart").append("g").attr("class","chart-bars"),w.select(".chart").append("g").attr("class","chart-lines"),w.append("g").attr("clip-path",Qa).attr("class","x brush").call(I).selectAll("rect").attr("height",na),w.append("g").attr("class", -"x axis").attr("transform",L.subx).call(Fa));Ba&&kb(h.data.targets);Hc(h.data.targets);z({withTransition:!1,withUpdateXDomain:!0});if(Ed){if(C&&"string"===typeof Ca){Ca=qa(Ca);for(a=0;axc(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor",null))}).on("click",function(){var a=c.mouse(this),d=mc(h.data.targets,a);100>xc(d,a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Jc(this, -d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Kc(c.mouse(this))}).on("dragstart",function(){Lc(c.mouse(this))}).on("dragend",function(){Mc()})).call(D).on("dblclick.zoom",null)}function Jc(a,b,d){var f=c.select(a),e=f.classed(ja),g=!1,h;"circle"===a.nodeName?(g=vc(a,1.5*Oa),h=zc):"rect"===a.nodeName&&(g=wc(a),h=Bc);if(ta||g)ia&&ua(b)&&(f.classed(ja,!e),h(!e,f,b,d)),Gd(b,f)}function Kc(a){if(ia&&(!sa||D.altDomain)){var b=Kb[0],d=Kb[1],f=a[0];a=a[1];var e=Math.min(b,f),g= -Math.max(b,f),h=ta?r:Math.min(d,a),m=ta?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ua(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ja),k=d.classed(Lb),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"),n=1*d.attr("cy"),q=zc,l=e",d,c,e;for(d=0;d"+e+""+c+"";return b+""}),Ed=e(["tooltip","init","show"],!1),Ca=e(["tooltip","init","x"],0),Ic=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Eb=xa.replace("#","")+"-clip",Qa="url(#"+Eb+")",C="timeseries"===Pc,X="categorized"===Pc,tb=!C&&(ra||Y),Kb=null,Ra=!1,Jb=!1,ma=Ba?40:0,$=function(a,b){var c=[],e=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in -a)return a[b];-1===c.indexOf(b)&&c.push(b);return e[c.indexOf(b)%e.length]}}(Md,Nd),Yc=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}], -[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Pb,Wb,Rb,Ya,Vb,Xb,q,p,na,ob,wa,Zb,$b,rb,sb,m,u,V,fa,Za,$a,B,oa,ab,Fa,Tc=g?"left":"bottom",Uc=g?qb?"top":"bottom":qb?"right":"left",Vc=g?pb?"bottom":"top":pb?"left":"right",Wc="bottom",L={main:function(){return"translate("+A+","+r+")"},context:function(){return"translate("+l+","+Da+")"},legend:function(){return"translate("+Ob+","+Nb+")"},y2:function(){return"translate("+ -(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+na+")"}},Id=function(){var a=c.svg.line().x(g?function(a){return F(a.id)(a.value)}:fb).y(g?fb:function(a){return F(a.id)(a.value)});return function(b){var c=Cc(b.values),e;if(xb(b))return"spline"===Z["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Oc[b.id]?rd(c,m,F(b.id),Oc[b.id]):a(c);e=m(c[0].x);b=F(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Jd=function(){var a= -c.svg.line().x(function(a){return fa(a.x)}).y(function(a){return T(a.id)(a.value)});return function(b){var c=Cc(b.values);return xb(b)?a(c):"M "+fa(c[0].x)+" "+T(b.id)(c[0].value)}}(),I=c.svg.brush().on("brush",function(){z({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}),D=c.behavior.zoom().on("zoomstart",function(){D.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",sa?Kd:null);I.update=function(){w&&w.select(".x.brush").call(this);return this};D.orgScaleExtent= -function(){var a=Nc?Nc:[1,10];return[a[0],Math.max(Ma()/a[1],a[1])]};D.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(W[1]-W[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Pa,ib,k,w,Aa,P,hb,pa=null,ya=null,W;h.focus=function(a){h.defocus();c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused", -!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Ua(a)).transition().style("opacity",1)};h.hide=function(a){c.selectAll(Ua(a)).transition().style("opacity",0)};h.unzoom=function(){I.clear().update();z({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&X&&(Ga=a.categories,B.categories(Ga)); -if("cacheIds"in a&&Wa(a.cacheIds))Sa(mb(a.cacheIds),a.done);else if("data"in a)Sa(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Sa(La(c),a.done)});else if("rows"in a)Sa(La(fc(a.rows)),a.done);else if("columns"in a)Sa(La(gc(a.columns)),a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Ba&&(c.selectAll(".legend-item-"+ -a).remove(),kb(h.data.targets));0b.classes.indexOf(a)})});return M};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}): -void 0};h.data.getAsTarget=function(a){var b=cb(function(b){return b.id===a});return 0a?0:a}function fc(a){return qa&&a===qa||X&&hd(X,a)}function id(a){return!fc(a)}function eb(a){var b=Ka[a.id];a.name=n(b)?b:a.id;return a}function gc(a){var b=a[0],d={},f=[],t,c;for(t=1;tu[d].indexOf(c.id)))for(f=0;f +b?a-b:0};return function(a){var c=b?S(a.id):F(a.id);return d(c(a.value))}}function gb(a,b){var d=s(a)?ub():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+=r)h+=f(a[c-1],a[c],e,l)}return h}function Eb(a){var b,d;hb=c.select(wa);if(hb.empty())P.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{hb.html("");h.data.x={};h.data.targets=La(a);ua();Nb();m.domain(c.extent(Va()));v.domain(ka("y"));U.domain(ka("y2"));ea.domain(m.domain());Za.domain(v.domain());$a.domain(U.domain());B.ticks(10>a.length?a.length:10);na.ticks(ud).outerTickSize(0).tickFormat(vd); +ab.ticks(wd).outerTickSize(0).tickFormat(xd);V=m.domain();H.x(ea);ra&&D.x(m);Pa=c.select(wa).append("svg").attr("width",q+A+da).attr("height",p+r+G).on("mouseenter",yd).on("mouseleave",zd);ib=Pa.append("defs");ib.append("clipPath").attr("id",Fb).append("rect").attr("y",r).attr("width",q).attr("height",p-r);ib.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",R).attr("height",Q);ib.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x", +-A+1).attr("y",r-1).attr("width",ja).attr("height",nb);k=Pa.append("g").attr("transform",K.main);w=za?Pa.append("g").attr("transform",K.context):null;Aa=Ba?Pa.append("g").attr("transform",K.legend):null;O=c.select(wa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",K.x).call(g?na:B).append("text").attr("class","-axis-x-label").attr("x", +q).attr("dy","-.5em").style("text-anchor","end").text(Ad);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?B:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(Bd);Ub&&k.append("g").attr("class","y2 axis").attr("transform",K.y2).call(ab);b=k.append("g").attr("clip-path",Qa).attr("class","grid");Hc&&b.append("g").attr("class","xgrids");Gb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Gb).enter().append("g").attr("class", +"xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g?0:-r).attr("dy",-6).text(function(a){return a.text}));Cd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2",g?q:-10).attr("y1",g?-10:r).attr("y2",g?-10:p);Ic&&b.append("g").attr("class","ygrids");Hb&&b.append("g").attr("class", +"ygrid-lines").selectAll("ygrid-line").data(Hb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Qa).attr("class","regions");k.append("g").attr("clip-path",Qa).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",ra?"ew-resize":null);X?Dd(b):Ed(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(ra)k.insert("rect", +Fd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(D).on("dblclick.zoom",null);null!==jb&&H.extent("function"!==typeof jb?jb:jb(oa,ya));za&&(w.append("g").attr("clip-path",Qa).attr("class","chart"),w.select(".chart").append("g").attr("class","chart-bars"),w.select(".chart").append("g").attr("class","chart-lines"),w.append("g").attr("clip-path",Qa).attr("class","x brush").call(H).selectAll("rect").attr("height",ma),w.append("g").attr("class", +"x axis").attr("transform",K.subx).call(Fa));Ba&&kb(h.data.targets);Jc(h.data.targets);z({withTransition:!1,withUpdateXDomain:!0});if(Gd){if(C&&"string"===typeof Ca){Ca=pa(Ca);for(a=0;axb(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor",null))}).on("click",function(){var a=c.mouse(this),d=pc(h.data.targets,a);100>xb(d,a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Lc(this, +d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Mc(c.mouse(this))}).on("dragstart",function(){Nc(c.mouse(this))}).on("dragend",function(){Oc()})).call(D).on("dblclick.zoom",null)}function Lc(a,b,d){var f=c.select(a),e=f.classed(ia),g=!1,h;"circle"===a.nodeName?(g=yc(a,1.5*Oa),h=Bc):"rect"===a.nodeName&&(g=zc(a),h=Dc);if(sa||g)ha&&ta(b)&&(f.classed(ia,!e),h(!e,f,b,d)),Id(b,f)}function Mc(a){if(ha&&(!ra||D.altDomain)){var b=Lb[0],d=Lb[1],f=a[0];a=a[1];var e=Math.min(b,f),g= +Math.max(b,f),h=sa?r:Math.min(d,a),m=sa?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ta(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ia),k=d.classed(Mb),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"),n=1*d.attr("cy"),q=Bc,l=e",d,c,e;for(d=0;d"+e+""+c+"";return b+""}),Gd=e(["tooltip","init","show"],!1),Ca=e(["tooltip","init","x"],0),Kc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Fb=wa.replace("#","")+"-clip",Qa="url(#"+Fb+")",C="timeseries"===Rc,W="categorized"===Rc,tb=!C&&(qa||X),Lb=null,Ra=!1,Kb=!1,la=Ba?40:0,Z=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in +a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(Od,Pd),$c=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}], +[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Qb,Xb,Sb,Ya,Wb,Yb,q,p,ma,ob,va,$b,ac,rb,sb,m,v,U,ea,Za,$a,B,na,ab,Fa,Vc=g?"left":"bottom",Wc=g?qb?"top":"bottom":qb?"right":"left",Xc=g?pb?"bottom":"top":pb?"left":"right",Yc="bottom",K={main:function(){return"translate("+A+","+r+")"},context:function(){return"translate("+l+","+Da+")"},legend:function(){return"translate("+Pb+","+Ob+")"},y2:function(){return"translate("+ +(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+ma+")"}},Kd=function(){var a=c.svg.line().x(g?function(a){return F(a.id)(a.value)}:fb).y(g?fb:function(a){return F(a.id)(a.value)});return function(b){var c=Ec(b.values),e;if(yb(b))return"spline"===Y["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Qc[b.id]?td(c,m,F(b.id),Qc[b.id]):a(c);e=m(c[0].x);b=F(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Ld=function(){var a= +c.svg.line().x(function(a){return ea(a.x)}).y(function(a){return S(a.id)(a.value)});return function(b){var c=Ec(b.values);return yb(b)?a(c):"M "+ea(c[0].x)+" "+S(b.id)(c[0].value)}}(),H=c.svg.brush().on("brush",function(){z({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}),D=c.behavior.zoom().on("zoomstart",function(){D.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Md:null);H.update=function(){w&&w.select(".x.brush").call(this);return this};D.orgScaleExtent= +function(){var a=Pc?Pc:[1,10];return[a[0],Math.max(Ma()/a[1],a[1])]};D.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(V[1]-V[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Pa,ib,k,w,Aa,O,hb,oa=null,ya=null,V;h.focus=function(a){h.defocus();c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused", +!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Ua(a)).transition().style("opacity",1)};h.hide=function(a){c.selectAll(Ua(a)).transition().style("opacity",0)};h.unzoom=function(){H.clear().update();z({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&W&&(Ga=a.categories,B.categories(Ga)); +if("cacheIds"in a&&Wa(a.cacheIds))Sa(mb(a.cacheIds),a.done);else if("data"in a)Sa(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Sa(La(c),a.done)});else if("rows"in a)Sa(La(gc(a.rows)),a.done);else if("columns"in a)Sa(La(hc(a.columns)),a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Ba&&(c.selectAll(".legend-item-"+ +a).remove(),kb(h.data.targets));0b.classes.indexOf(a)})});return L};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}): +void 0};h.data.getAsTarget=function(a){var b=cb(function(b){return b.id===a});return 0 Date: Thu, 6 Feb 2014 10:39:21 +0900 Subject: [PATCH 24/31] Add data.type option --- c3.js | 7 +++ c3.min.js | 147 +++++++++++++++++++++++++++--------------------------- 2 files changed, 81 insertions(+), 73 deletions(-) diff --git a/c3.js b/c3.js index 7e01403..be59391 100644 --- a/c3.js +++ b/c3.js @@ -55,6 +55,7 @@ __data_names = getConfig(['data', 'names'], {}), __data_groups = getConfig(['data', 'groups'], []), __data_axes = getConfig(['data', 'axes'], {}), + __data_type = getConfig(['data', 'type'], null), __data_types = getConfig(['data', 'types'], {}), __data_regions = getConfig(['data', 'regions'], {}), __data_colors = getConfig(['data', 'colors'], {}), @@ -1123,11 +1124,17 @@ selectChart.html(""); } + // Init data as targets c3.data.x = {}; c3.data.targets = convertDataToTargets(data); // TODO: set names if names not specified + // Set data type if data.type is specified + if (__data_type) { + setTargetType(getTargetIds().filter(function (id) { return ! (id in __data_types); }), __data_type); + } + // Init sizes and scales updateSizes(); updateScales(); diff --git a/c3.min.js b/c3.min.js index d7fa9dd..bfa5212 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,73 +1,74 @@ -(function(P){function Sc(){function n(c,e){c.attr("transform",function(c){return"translate("+(e(c)+ba)+", 0)"})}function s(c,e){c.attr("transform",function(c){return"translate(0,"+e(c)+")"})}function P(c){var e=c[0];c=c[c.length-1];return ea?0:a}function fc(a){return qa&&a===qa||X&&hd(X,a)}function id(a){return!fc(a)}function eb(a){var b=Ka[a.id];a.name=n(b)?b:a.id;return a}function gc(a){var b=a[0],d={},f=[],t,c;for(t=1;tu[d].indexOf(c.id)))for(f=0;f -b?a-b:0};return function(a){var c=b?S(a.id):F(a.id);return d(c(a.value))}}function gb(a,b){var d=s(a)?ub():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+=r)h+=f(a[c-1],a[c],e,l)}return h}function Eb(a){var b,d;hb=c.select(wa);if(hb.empty())P.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{hb.html("");h.data.x={};h.data.targets=La(a);ua();Nb();m.domain(c.extent(Va()));v.domain(ka("y"));U.domain(ka("y2"));ea.domain(m.domain());Za.domain(v.domain());$a.domain(U.domain());B.ticks(10>a.length?a.length:10);na.ticks(ud).outerTickSize(0).tickFormat(vd); -ab.ticks(wd).outerTickSize(0).tickFormat(xd);V=m.domain();H.x(ea);ra&&D.x(m);Pa=c.select(wa).append("svg").attr("width",q+A+da).attr("height",p+r+G).on("mouseenter",yd).on("mouseleave",zd);ib=Pa.append("defs");ib.append("clipPath").attr("id",Fb).append("rect").attr("y",r).attr("width",q).attr("height",p-r);ib.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",R).attr("height",Q);ib.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x", --A+1).attr("y",r-1).attr("width",ja).attr("height",nb);k=Pa.append("g").attr("transform",K.main);w=za?Pa.append("g").attr("transform",K.context):null;Aa=Ba?Pa.append("g").attr("transform",K.legend):null;O=c.select(wa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",K.x).call(g?na:B).append("text").attr("class","-axis-x-label").attr("x", -q).attr("dy","-.5em").style("text-anchor","end").text(Ad);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?B:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(Bd);Ub&&k.append("g").attr("class","y2 axis").attr("transform",K.y2).call(ab);b=k.append("g").attr("clip-path",Qa).attr("class","grid");Hc&&b.append("g").attr("class","xgrids");Gb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Gb).enter().append("g").attr("class", -"xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g?0:-r).attr("dy",-6).text(function(a){return a.text}));Cd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2",g?q:-10).attr("y1",g?-10:r).attr("y2",g?-10:p);Ic&&b.append("g").attr("class","ygrids");Hb&&b.append("g").attr("class", -"ygrid-lines").selectAll("ygrid-line").data(Hb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Qa).attr("class","regions");k.append("g").attr("clip-path",Qa).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",ra?"ew-resize":null);X?Dd(b):Ed(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(ra)k.insert("rect", -Fd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(D).on("dblclick.zoom",null);null!==jb&&H.extent("function"!==typeof jb?jb:jb(oa,ya));za&&(w.append("g").attr("clip-path",Qa).attr("class","chart"),w.select(".chart").append("g").attr("class","chart-bars"),w.select(".chart").append("g").attr("class","chart-lines"),w.append("g").attr("clip-path",Qa).attr("class","x brush").call(H).selectAll("rect").attr("height",ma),w.append("g").attr("class", -"x axis").attr("transform",K.subx).call(Fa));Ba&&kb(h.data.targets);Jc(h.data.targets);z({withTransition:!1,withUpdateXDomain:!0});if(Gd){if(C&&"string"===typeof Ca){Ca=pa(Ca);for(a=0;axb(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor",null))}).on("click",function(){var a=c.mouse(this),d=pc(h.data.targets,a);100>xb(d,a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Lc(this, -d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Mc(c.mouse(this))}).on("dragstart",function(){Nc(c.mouse(this))}).on("dragend",function(){Oc()})).call(D).on("dblclick.zoom",null)}function Lc(a,b,d){var f=c.select(a),e=f.classed(ia),g=!1,h;"circle"===a.nodeName?(g=yc(a,1.5*Oa),h=Bc):"rect"===a.nodeName&&(g=zc(a),h=Dc);if(sa||g)ha&&ta(b)&&(f.classed(ia,!e),h(!e,f,b,d)),Id(b,f)}function Mc(a){if(ha&&(!ra||D.altDomain)){var b=Lb[0],d=Lb[1],f=a[0];a=a[1];var e=Math.min(b,f),g= -Math.max(b,f),h=sa?r:Math.min(d,a),m=sa?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ta(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ia),k=d.classed(Mb),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"),n=1*d.attr("cy"),q=Bc,l=e",d,c,e;for(d=0;d"+e+""+c+"";return b+""}),Gd=e(["tooltip","init","show"],!1),Ca=e(["tooltip","init","x"],0),Kc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Fb=wa.replace("#","")+"-clip",Qa="url(#"+Fb+")",C="timeseries"===Rc,W="categorized"===Rc,tb=!C&&(qa||X),Lb=null,Ra=!1,Kb=!1,la=Ba?40:0,Z=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in -a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(Od,Pd),$c=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}], -[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Qb,Xb,Sb,Ya,Wb,Yb,q,p,ma,ob,va,$b,ac,rb,sb,m,v,U,ea,Za,$a,B,na,ab,Fa,Vc=g?"left":"bottom",Wc=g?qb?"top":"bottom":qb?"right":"left",Xc=g?pb?"bottom":"top":pb?"left":"right",Yc="bottom",K={main:function(){return"translate("+A+","+r+")"},context:function(){return"translate("+l+","+Da+")"},legend:function(){return"translate("+Pb+","+Ob+")"},y2:function(){return"translate("+ -(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+ma+")"}},Kd=function(){var a=c.svg.line().x(g?function(a){return F(a.id)(a.value)}:fb).y(g?fb:function(a){return F(a.id)(a.value)});return function(b){var c=Ec(b.values),e;if(yb(b))return"spline"===Y["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Qc[b.id]?td(c,m,F(b.id),Qc[b.id]):a(c);e=m(c[0].x);b=F(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Ld=function(){var a= -c.svg.line().x(function(a){return ea(a.x)}).y(function(a){return S(a.id)(a.value)});return function(b){var c=Ec(b.values);return yb(b)?a(c):"M "+ea(c[0].x)+" "+S(b.id)(c[0].value)}}(),H=c.svg.brush().on("brush",function(){z({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}),D=c.behavior.zoom().on("zoomstart",function(){D.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Md:null);H.update=function(){w&&w.select(".x.brush").call(this);return this};D.orgScaleExtent= -function(){var a=Pc?Pc:[1,10];return[a[0],Math.max(Ma()/a[1],a[1])]};D.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(V[1]-V[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Pa,ib,k,w,Aa,O,hb,oa=null,ya=null,V;h.focus=function(a){h.defocus();c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused", -!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Ua(a)).filter(function(a){return vb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Ua(a)).transition().style("opacity",1)};h.hide=function(a){c.selectAll(Ua(a)).transition().style("opacity",0)};h.unzoom=function(){H.clear().update();z({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&W&&(Ga=a.categories,B.categories(Ga)); -if("cacheIds"in a&&Wa(a.cacheIds))Sa(mb(a.cacheIds),a.done);else if("data"in a)Sa(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Sa(La(c),a.done)});else if("rows"in a)Sa(La(gc(a.rows)),a.done);else if("columns"in a)Sa(La(hc(a.columns)),a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Ba&&(c.selectAll(".legend-item-"+ -a).remove(),kb(h.data.targets));0b.classes.indexOf(a)})});return L};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}): -void 0};h.data.getAsTarget=function(a){var b=cb(function(b){return b.id===a});return 0a?0:a}function fc(a){return qa&&a===qa||Y&&id(Y,a)}function jd(a){return!fc(a)}function fb(a){var b=Ka[a.id];a.name=n(b)?b:a.id;return a}function gc(a){var b=a[0],d={},f=[],t,c;for(t=1;tu[d].indexOf(c.id)))for(f=0;f +b?a-b:0};return function(a){var c=b?T(a.id):F(a.id);return d(c(a.value))}}function Oa(a,b){var d=s(a)?gb():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+=r)h+=f(a[c-1],a[c],e,l)}return h}function Eb(a){var b,d;ib=c.select(wa);if(ib.empty())Q.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{ib.html("");h.data.x={};h.data.targets=La(a);Hc&&Oa(gb().filter(function(a){return!(a in P)}),Hc);ua();Nb();m.domain(c.extent(Wa()));v.domain(ka("y"));V.domain(ka("y2"));ea.domain(m.domain());$a.domain(v.domain());ab.domain(V.domain()); +B.ticks(10>a.length?a.length:10);na.ticks(vd).outerTickSize(0).tickFormat(wd);bb.ticks(xd).outerTickSize(0).tickFormat(yd);W=m.domain();H.x(ea);ra&&D.x(m);Qa=c.select(wa).append("svg").attr("width",q+A+da).attr("height",p+r+G).on("mouseenter",zd).on("mouseleave",Ad);jb=Qa.append("defs");jb.append("clipPath").attr("id",Fb).append("rect").attr("y",r).attr("width",q).attr("height",p-r);jb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",S).attr("height", +R);jb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",r-1).attr("width",ja).attr("height",ob);k=Qa.append("g").attr("transform",K.main);w=za?Qa.append("g").attr("transform",K.context):null;Aa=Ba?Qa.append("g").attr("transform",K.legend):null;O=c.select(wa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform", +K.x).call(g?na:B).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(Bd);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?B:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(Cd);Ub&&k.append("g").attr("class","y2 axis").attr("transform",K.y2).call(bb);b=k.append("g").attr("clip-path",Ra).attr("class","grid");Ic&&b.append("g").attr("class", +"xgrids");Gb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Gb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g?0:-r).attr("dy",-6).text(function(a){return a.text}));Dd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2", +g?q:-10).attr("y1",g?-10:r).attr("y2",g?-10:p);Jc&&b.append("g").attr("class","ygrids");Hb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Hb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Ra).attr("class","regions");k.append("g").attr("clip-path",Ra).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",ra?"ew-resize":null);Y?Ed(b):Fd(b,a); +k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(ra)k.insert("rect",Gd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(D).on("dblclick.zoom",null);null!==kb&&H.extent("function"!==typeof kb?kb:kb(oa,ya));za&&(w.append("g").attr("clip-path",Ra).attr("class","chart"),w.select(".chart").append("g").attr("class","chart-bars"),w.select(".chart").append("g").attr("class", +"chart-lines"),w.append("g").attr("clip-path",Ra).attr("class","x brush").call(H).selectAll("rect").attr("height",ma),w.append("g").attr("class","x axis").attr("transform",K.subx).call(Fa));Ba&&lb(h.data.targets);Kc(h.data.targets);z({withTransition:!1,withUpdateXDomain:!0});if(Hd){if(C&&"string"===typeof Ca){Ca=pa(Ca);for(a=0;axb(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor",null))}).on("click", +function(){var a=c.mouse(this),d=pc(h.data.targets,a);100>xb(d,a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Mc(this,d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Nc(c.mouse(this))}).on("dragstart",function(){Oc(c.mouse(this))}).on("dragend",function(){Pc()})).call(D).on("dblclick.zoom",null)}function Mc(a,b,d){var f=c.select(a),e=f.classed(ia),g=!1,h;"circle"===a.nodeName?(g=yc(a,1.5*Pa),h=Bc):"rect"===a.nodeName&&(g=zc(a),h=Dc);if(sa||g)ha&& +ta(b)&&(f.classed(ia,!e),h(!e,f,b,d)),Jd(b,f)}function Nc(a){if(ha&&(!ra||D.altDomain)){var b=Lb[0],d=Lb[1],f=a[0];a=a[1];var e=Math.min(b,f),g=Math.max(b,f),h=sa?r:Math.min(d,a),m=sa?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ta(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ia),k=d.classed(Mb),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"),n=1*d.attr("cy"), +q=Bc,l=e", +d,c,e;for(d=0;d"+e+""+c+"";return b+""}),Hd=e(["tooltip","init","show"],!1),Ca=e(["tooltip","init","x"],0),Lc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Fb=wa.replace("#","")+"-clip",Ra="url(#"+Fb+")",C="timeseries"===Sc,X="categorized"=== +Sc,ub=!C&&(qa||Y),Lb=null,Sa=!1,Kb=!1,la=Ba?40:0,Z=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(Pd,Qd),ad=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"), +function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}],[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Qb,Xb,Sb,Za,Wb,Yb,q,p,ma,pb,va,$b,ac,sb,tb,m,v,V,ea,$a,ab,B,na,bb,Fa,Wc=g?"left":"bottom",Xc=g?rb?"top":"bottom":rb?"right":"left", +Yc=g?qb?"bottom":"top":qb?"left":"right",Zc="bottom",K={main:function(){return"translate("+A+","+r+")"},context:function(){return"translate("+l+","+Da+")"},legend:function(){return"translate("+Pb+","+Ob+")"},y2:function(){return"translate("+(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+ma+")"}},Ld=function(){var a=c.svg.line().x(g?function(a){return F(a.id)(a.value)}:hb).y(g?hb:function(a){return F(a.id)(a.value)});return function(b){var c= +Ec(b.values),e;if(yb(b))return"spline"===P["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Rc[b.id]?ud(c,m,F(b.id),Rc[b.id]):a(c);e=m(c[0].x);b=F(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Md=function(){var a=c.svg.line().x(function(a){return ea(a.x)}).y(function(a){return T(a.id)(a.value)});return function(b){var c=Ec(b.values);return yb(b)?a(c):"M "+ea(c[0].x)+" "+T(b.id)(c[0].value)}}(),H=c.svg.brush().on("brush",function(){z({withTransition:!1,withY:!1, +withSubchart:!1,withUpdateXDomain:!0})}),D=c.behavior.zoom().on("zoomstart",function(){D.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Nd:null);H.update=function(){w&&w.select(".x.brush").call(this);return this};D.orgScaleExtent=function(){var a=Qc?Qc:[1,10];return[a[0],Math.max(Ma()/a[1],a[1])]};D.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(W[1]-W[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Qa,jb,k,w,Aa,O,ib,oa=null, +ya=null,W;h.focus=function(a){h.defocus();c.selectAll(Va(a)).filter(function(a){return vb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Va(a)).filter(function(a){return vb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Va(a)).filter(function(a){return vb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Va(a)).transition().style("opacity", +1)};h.hide=function(a){c.selectAll(Va(a)).transition().style("opacity",0)};h.unzoom=function(){H.clear().update();z({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&X&&(Ga=a.categories,B.categories(Ga));if("cacheIds"in a&&Xa(a.cacheIds))Ta(nb(a.cacheIds),a.done);else if("data"in a)Ta(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Ta(La(c),a.done)});else if("rows"in a)Ta(La(gc(a.rows)),a.done);else if("columns"in a)Ta(La(hc(a.columns)), +a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Ba&&(c.selectAll(".legend-item-"+a).remove(),lb(h.data.targets));0b.classes.indexOf(a)})});return L};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b=db(function(b){return b.id===a});return 0 Date: Thu, 6 Feb 2014 10:49:44 +0900 Subject: [PATCH 25/31] Fix x grid focus --- c3.js | 8 ++++---- c3.min.js | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/c3.js b/c3.js index be59391..4f4d1bb 100644 --- a/c3.js +++ b/c3.js @@ -721,8 +721,8 @@ } function showXGridFocus(data) { - // Show when line chart exists - if (! hasLineType(c3.data.targets)) { return; } + // Hide when scatter plot exists + if (hasScatterType(c3.data.targets)) { return; } main.selectAll('line.xgrid-focus') .style("visibility", "visible") .data([data]) @@ -817,17 +817,17 @@ }); return has; } + /* not used function hasLineType(targets) { return hasType(targets, 'line'); } + */ function hasBarType(targets) { return hasType(targets, 'bar'); } - /* not used function hasScatterType(targets) { return hasType(targets, 'scatter'); } - */ function isLineType(d) { var id = (typeof d === 'string') ? d : d.id; return !(id in __data_types) || __data_types[id] === 'line' || __data_types[id] === 'spline'; diff --git a/c3.min.js b/c3.min.js index bfa5212..607f09d 100644 --- a/c3.min.js +++ b/c3.min.js @@ -15,7 +15,7 @@ null:+a[b],id:d}})}});b.forEach(function(a){var b;a.values=a.values.sort(functio function vb(a){var b=gb(),d;for(d=0;du[d].indexOf(c.id)))for(f=0;fu[d].indexOf(c.id)))for(f=0;f b?a-b:0};return function(a){var c=b?T(a.id):F(a.id);return d(c(a.value))}}function Oa(a,b){var d=s(a)?gb():a;"string"===typeof d&&(d=[d]);for(var f=0;f Date: Thu, 6 Feb 2014 10:54:50 +0900 Subject: [PATCH 26/31] Update version --- bower.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/bower.json b/bower.json index 6f96028..08044ad 100644 --- a/bower.json +++ b/bower.json @@ -1,7 +1,7 @@ { "name": "c3", "main": "c3.min.js", - "version": "0.1.4", + "version": "0.1.5", "homepage": "https://github.com/masayuki0812/c3", "authors": [ "Masayuki Tanaka " diff --git a/package.json b/package.json index 4c80e2e..70a6813 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "c3", - "version": "0.1.4", + "version": "0.1.5", "description": "D3-based reusable chart library", "main": "c3.js", "scripts": { From 52ead5ab7d5d5a09930a187dab74f90bc1925c46 Mon Sep 17 00:00:00 2001 From: Masayuki Tanaka Date: Fri, 7 Feb 2014 18:58:56 +0900 Subject: [PATCH 27/31] Fix padding when timeseries data --- c3.js | 6 ++- c3.min.js | 146 +++++++++++++++++++++++++++--------------------------- 2 files changed, 77 insertions(+), 75 deletions(-) diff --git a/c3.js b/c3.js index 4f4d1bb..4950384 100644 --- a/c3.js +++ b/c3.js @@ -421,8 +421,10 @@ return (domain[1] - domain[0]) / (extent[1] - extent[0]); } function getDefaultXDomain() { - var padding = isCategorized ? 0 : Math.abs(lastX - firstX) * 0.01; - return [firstX - padding, lastX + padding]; + var padding = isCategorized ? 0 : Math.abs(firstX - lastX) * 0.01, + min = isTimeSeries ? new Date(firstX.getTime() - padding) : firstX - padding, + max = isTimeSeries ? new Date(lastX.getTime() + padding) : lastX + padding; + return [min, max]; } function diffDomain(d) { return d[1] - d[0]; diff --git a/c3.min.js b/c3.min.js index 607f09d..4966bbc 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,74 +1,74 @@ -(function(Q){function Tc(){function n(c,e){c.attr("transform",function(c){return"translate("+(e(c)+ba)+", 0)"})}function s(c,e){c.attr("transform",function(c){return"translate(0,"+e(c)+")"})}function Q(c){var e=c[0];c=c[c.length-1];return ea?0:a}function fc(a){return qa&&a===qa||Y&&id(Y,a)}function jd(a){return!fc(a)}function fb(a){var b=Ka[a.id];a.name=n(b)?b:a.id;return a}function gc(a){var b=a[0],d={},f=[],t,c;for(t=1;tu[d].indexOf(c.id)))for(f=0;f -b?a-b:0};return function(a){var c=b?T(a.id):F(a.id);return d(c(a.value))}}function Oa(a,b){var d=s(a)?gb():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+=r)h+=f(a[c-1],a[c],e,l)}return h}function Eb(a){var b,d;ib=c.select(wa);if(ib.empty())Q.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{ib.html("");h.data.x={};h.data.targets=La(a);Hc&&Oa(gb().filter(function(a){return!(a in P)}),Hc);ua();Nb();m.domain(c.extent(Wa()));v.domain(ka("y"));V.domain(ka("y2"));ea.domain(m.domain());$a.domain(v.domain());ab.domain(V.domain()); -B.ticks(10>a.length?a.length:10);na.ticks(vd).outerTickSize(0).tickFormat(wd);bb.ticks(xd).outerTickSize(0).tickFormat(yd);W=m.domain();H.x(ea);ra&&D.x(m);Qa=c.select(wa).append("svg").attr("width",q+A+da).attr("height",p+r+G).on("mouseenter",zd).on("mouseleave",Ad);jb=Qa.append("defs");jb.append("clipPath").attr("id",Fb).append("rect").attr("y",r).attr("width",q).attr("height",p-r);jb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-A).attr("y",-20).attr("width",S).attr("height", -R);jb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",r-1).attr("width",ja).attr("height",ob);k=Qa.append("g").attr("transform",K.main);w=za?Qa.append("g").attr("transform",K.context):null;Aa=Ba?Qa.append("g").attr("transform",K.legend):null;O=c.select(wa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform", -K.x).call(g?na:B).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(Bd);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?B:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(Cd);Ub&&k.append("g").attr("class","y2 axis").attr("transform",K.y2).call(bb);b=k.append("g").attr("clip-path",Ra).attr("class","grid");Ic&&b.append("g").attr("class", -"xgrids");Gb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Gb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g?0:-r).attr("dy",-6).text(function(a){return a.text}));Dd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2", -g?q:-10).attr("y1",g?-10:r).attr("y2",g?-10:p);Jc&&b.append("g").attr("class","ygrids");Hb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Hb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Ra).attr("class","regions");k.append("g").attr("clip-path",Ra).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",ra?"ew-resize":null);Y?Ed(b):Fd(b,a); -k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(ra)k.insert("rect",Gd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(D).on("dblclick.zoom",null);null!==kb&&H.extent("function"!==typeof kb?kb:kb(oa,ya));za&&(w.append("g").attr("clip-path",Ra).attr("class","chart"),w.select(".chart").append("g").attr("class","chart-bars"),w.select(".chart").append("g").attr("class", -"chart-lines"),w.append("g").attr("clip-path",Ra).attr("class","x brush").call(H).selectAll("rect").attr("height",ma),w.append("g").attr("class","x axis").attr("transform",K.subx).call(Fa));Ba&&lb(h.data.targets);Kc(h.data.targets);z({withTransition:!1,withUpdateXDomain:!0});if(Hd){if(C&&"string"===typeof Ca){Ca=pa(Ca);for(a=0;axb(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor",null))}).on("click", -function(){var a=c.mouse(this),d=pc(h.data.targets,a);100>xb(d,a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Mc(this,d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Nc(c.mouse(this))}).on("dragstart",function(){Oc(c.mouse(this))}).on("dragend",function(){Pc()})).call(D).on("dblclick.zoom",null)}function Mc(a,b,d){var f=c.select(a),e=f.classed(ia),g=!1,h;"circle"===a.nodeName?(g=yc(a,1.5*Pa),h=Bc):"rect"===a.nodeName&&(g=zc(a),h=Dc);if(sa||g)ha&& -ta(b)&&(f.classed(ia,!e),h(!e,f,b,d)),Jd(b,f)}function Nc(a){if(ha&&(!ra||D.altDomain)){var b=Lb[0],d=Lb[1],f=a[0];a=a[1];var e=Math.min(b,f),g=Math.max(b,f),h=sa?r:Math.min(d,a),m=sa?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ta(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ia),k=d.classed(Mb),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"),n=1*d.attr("cy"), -q=Bc,l=e", -d,c,e;for(d=0;d"+e+""+c+"";return b+""}),Hd=e(["tooltip","init","show"],!1),Ca=e(["tooltip","init","x"],0),Lc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Fb=wa.replace("#","")+"-clip",Ra="url(#"+Fb+")",C="timeseries"===Sc,X="categorized"=== -Sc,ub=!C&&(qa||Y),Lb=null,Sa=!1,Kb=!1,la=Ba?40:0,Z=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(Pd,Qd),ad=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"), -function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}],[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Qb,Xb,Sb,Za,Wb,Yb,q,p,ma,pb,va,$b,ac,sb,tb,m,v,V,ea,$a,ab,B,na,bb,Fa,Wc=g?"left":"bottom",Xc=g?rb?"top":"bottom":rb?"right":"left", -Yc=g?qb?"bottom":"top":qb?"left":"right",Zc="bottom",K={main:function(){return"translate("+A+","+r+")"},context:function(){return"translate("+l+","+Da+")"},legend:function(){return"translate("+Pb+","+Ob+")"},y2:function(){return"translate("+(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+ma+")"}},Ld=function(){var a=c.svg.line().x(g?function(a){return F(a.id)(a.value)}:hb).y(g?hb:function(a){return F(a.id)(a.value)});return function(b){var c= -Ec(b.values),e;if(yb(b))return"spline"===P["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Rc[b.id]?ud(c,m,F(b.id),Rc[b.id]):a(c);e=m(c[0].x);b=F(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Md=function(){var a=c.svg.line().x(function(a){return ea(a.x)}).y(function(a){return T(a.id)(a.value)});return function(b){var c=Ec(b.values);return yb(b)?a(c):"M "+ea(c[0].x)+" "+T(b.id)(c[0].value)}}(),H=c.svg.brush().on("brush",function(){z({withTransition:!1,withY:!1, -withSubchart:!1,withUpdateXDomain:!0})}),D=c.behavior.zoom().on("zoomstart",function(){D.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Nd:null);H.update=function(){w&&w.select(".x.brush").call(this);return this};D.orgScaleExtent=function(){var a=Qc?Qc:[1,10];return[a[0],Math.max(Ma()/a[1],a[1])]};D.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(W[1]-W[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Qa,jb,k,w,Aa,O,ib,oa=null, -ya=null,W;h.focus=function(a){h.defocus();c.selectAll(Va(a)).filter(function(a){return vb(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Va(a)).filter(function(a){return vb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Va(a)).filter(function(a){return vb(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Va(a)).transition().style("opacity", -1)};h.hide=function(a){c.selectAll(Va(a)).transition().style("opacity",0)};h.unzoom=function(){H.clear().update();z({withUpdateXDomain:!0})};h.load=function(a){s(a.done)&&(a.done=function(){});"categories"in a&&X&&(Ga=a.categories,B.categories(Ga));if("cacheIds"in a&&Xa(a.cacheIds))Ta(nb(a.cacheIds),a.done);else if("data"in a)Ta(La(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Ta(La(c),a.done)});else if("rows"in a)Ta(La(gc(a.rows)),a.done);else if("columns"in a)Ta(La(hc(a.columns)), -a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Ba&&(c.selectAll(".legend-item-"+a).remove(),lb(h.data.targets));0b.classes.indexOf(a)})});return L};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b=db(function(b){return b.id===a});return 0a?0:a}function ec(a){return qa&&a===qa||X&&hd(X,a)}function id(a){return!ec(a)}function eb(a){var b=Ja[a.id];a.name=n(b)?b:a.id;return a}function fc(a){var b=a[0],d={},f=[],u,c;for(u=1;u +v[d].indexOf(c.id)))for(f=0;fb?a-b:0};return function(a){var c=b?S(a.id):E(a.id);return d(c(a.value))}}function Na(a,b){var d=t(a)?fb():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+=s)h+=f(a[c-1],a[c],e,l)}return h}function Db(a){var b,d;hb=c.select(wa);if(hb.empty())P.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{hb.html("");h.data.x={};h.data.targets=Ka(a);Gc&&Na(fb().filter(function(a){return!(a in O)}),Gc);ua();Mb();m.domain(c.extent(Va()));w.domain(ka("y"));U.domain(ka("y2"));da.domain(m.domain()); +Za.domain(w.domain());$a.domain(U.domain());B.ticks(10>a.length?a.length:10);na.ticks(ud).outerTickSize(0).tickFormat(vd);ab.ticks(wd).outerTickSize(0).tickFormat(xd);V=m.domain();G.x(da);ra&&C.x(m);Pa=c.select(wa).append("svg").attr("width",q+A+ca).attr("height",p+s+F).on("mouseenter",yd).on("mouseleave",zd);ib=Pa.append("defs");ib.append("clipPath").attr("id",Eb).append("rect").attr("y",s).attr("width",q).attr("height",p-s);ib.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1- +A).attr("y",-20).attr("width",R).attr("height",Q);ib.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",s-1).attr("width",ja).attr("height",nb);k=Pa.append("g").attr("transform",J.main);x=ya?Pa.append("g").attr("transform",J.context):null;za=Aa?Pa.append("g").attr("transform",J.legend):null;N=c.select(wa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path", +g?"":"url(#xaxis-clip)").attr("transform",J.x).call(g?na:B).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(Ad);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?B:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(Bd);Tb&&k.append("g").attr("class","y2 axis").attr("transform",J.y2).call(ab);b=k.append("g").attr("clip-path",Qa).attr("class", +"grid");Hc&&b.append("g").attr("class","xgrids");Fb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Fb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g?0:-s).attr("dy",-6).text(function(a){return a.text}));Cd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class", +"xgrid-focus").attr("x1",g?0:-10).attr("x2",g?q:-10).attr("y1",g?-10:s).attr("y2",g?-10:p);Ic&&b.append("g").attr("class","ygrids");Gb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Gb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Qa).attr("class","regions");k.append("g").attr("clip-path",Qa).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor", +ra?"ew-resize":null);X?Dd(b):Ed(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(ra)k.insert("rect",Fd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(C).on("dblclick.zoom",null);null!==jb&&G.extent("function"!==typeof jb?jb:jb(ea,oa));ya&&(x.append("g").attr("clip-path",Qa).attr("class","chart"),x.select(".chart").append("g").attr("class","chart-bars"), +x.select(".chart").append("g").attr("class","chart-lines"),x.append("g").attr("clip-path",Qa).attr("class","x brush").call(G).selectAll("rect").attr("height",ma),x.append("g").attr("class","x axis").attr("transform",J.subx).call(Ea));Aa&&kb(h.data.targets);Jc(h.data.targets);z({withTransition:!1,withUpdateXDomain:!0});if(Gd){if(r&&"string"===typeof Ba){Ba=pa(Ba);for(a=0;awb(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor", +null))}).on("click",function(){var a=c.mouse(this),d=oc(h.data.targets,a);100>wb(d,a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Lc(this,d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Mc(c.mouse(this))}).on("dragstart",function(){Nc(c.mouse(this))}).on("dragend",function(){Oc()})).call(C).on("dblclick.zoom",null)}function Lc(a,b,d){var f=c.select(a),e=f.classed(ia),g=!1,h;"circle"===a.nodeName?(g=xc(a,1.5*Oa),h=Ac):"rect"===a.nodeName&&(g=yc(a), +h=Cc);if(sa||g)ha&&ta(b)&&(f.classed(ia,!e),h(!e,f,b,d)),Id(b,f)}function Mc(a){if(ha&&(!ra||C.altDomain)){var b=Kb[0],d=Kb[1],f=a[0];a=a[1];var e=Math.min(b,f),g=Math.max(b,f),h=sa?s:Math.min(d,a),m=sa?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ta(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ia),k=d.classed(Lb),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"), +n=1*d.attr("cy"),q=Ac,l=e", +d,c,e;for(d=0;d"+e+""+c+"";return b+""}),Gd=e(["tooltip","init","show"],!1),Ba=e(["tooltip","init","x"],0),Kc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Eb=wa.replace("#","")+"-clip",Qa="url(#"+Eb+")",r="timeseries"===Rc,W="categorized"=== +Rc,tb=!r&&(qa||X),Kb=null,Ra=!1,Jb=!1,la=Aa?40:0,Y=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(Od,Pd),$c=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"), +function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}],[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Pb,Wb,Rb,Ya,Vb,Xb,q,p,ma,ob,va,Zb,$b,rb,sb,m,w,U,da,Za,$a,B,na,ab,Ea,Vc=g?"left":"bottom",Wc=g?qb?"top":"bottom":qb?"right":"left", +Xc=g?pb?"bottom":"top":pb?"left":"right",Yc="bottom",J={main:function(){return"translate("+A+","+s+")"},context:function(){return"translate("+l+","+Ca+")"},legend:function(){return"translate("+Ob+","+Nb+")"},y2:function(){return"translate("+(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+ma+")"}},Kd=function(){var a=c.svg.line().x(g?function(a){return E(a.id)(a.value)}:gb).y(g?gb:function(a){return E(a.id)(a.value)});return function(b){var c= +Dc(b.values),e;if(xb(b))return"spline"===O["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Qc[b.id]?td(c,m,E(b.id),Qc[b.id]):a(c);e=m(c[0].x);b=E(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Ld=function(){var a=c.svg.line().x(function(a){return da(a.x)}).y(function(a){return S(a.id)(a.value)});return function(b){var c=Dc(b.values);return xb(b)?a(c):"M "+da(c[0].x)+" "+S(b.id)(c[0].value)}}(),G=c.svg.brush().on("brush",function(){z({withTransition:!1,withY:!1, +withSubchart:!1,withUpdateXDomain:!0})}),C=c.behavior.zoom().on("zoomstart",function(){C.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Md:null);G.update=function(){x&&x.select(".x.brush").call(this);return this};C.orgScaleExtent=function(){var a=Pc?Pc:[1,10];return[a[0],Math.max(La()/a[1],a[1])]};C.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(V[1]-V[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Pa,ib,k,x,za,N,hb,ea=null, +oa=null,V;h.focus=function(a){h.defocus();c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Ua(a)).transition().style("opacity", +1)};h.hide=function(a){c.selectAll(Ua(a)).transition().style("opacity",0)};h.unzoom=function(){G.clear().update();z({withUpdateXDomain:!0})};h.load=function(a){t(a.done)&&(a.done=function(){});"categories"in a&&W&&(Fa=a.categories,B.categories(Fa));if("cacheIds"in a&&Wa(a.cacheIds))Sa(mb(a.cacheIds),a.done);else if("data"in a)Sa(Ka(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Sa(Ka(c),a.done)});else if("rows"in a)Sa(Ka(fc(a.rows)),a.done);else if("columns"in a)Sa(Ka(gc(a.columns)), +a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Aa&&(c.selectAll(".legend-item-"+a).remove(),kb(h.data.targets));0b.classes.indexOf(a)})});return K};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b=cb(function(b){return b.id===a});return 0 Date: Fri, 7 Feb 2014 18:59:41 +0900 Subject: [PATCH 28/31] Update version for bug fix --- bower.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/bower.json b/bower.json index 08044ad..888eb19 100644 --- a/bower.json +++ b/bower.json @@ -1,7 +1,7 @@ { "name": "c3", "main": "c3.min.js", - "version": "0.1.5", + "version": "0.1.6", "homepage": "https://github.com/masayuki0812/c3", "authors": [ "Masayuki Tanaka " diff --git a/package.json b/package.json index 70a6813..36b6c59 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "c3", - "version": "0.1.5", + "version": "0.1.6", "description": "D3-based reusable chart library", "main": "c3.js", "scripts": { From cf2fd50e1ec166f16f25f6c2581817353c68dd4b Mon Sep 17 00:00:00 2001 From: Danner Date: Fri, 7 Feb 2014 10:07:12 -0500 Subject: [PATCH 29/31] Fixed typo on index page. --- htdocs/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/htdocs/index.html b/htdocs/index.html index 990d697..54dcf4b 100644 --- a/htdocs/index.html +++ b/htdocs/index.html @@ -66,7 +66,7 @@

Load Data

-

Load data dinamically.

+

Load data dynamically.

View details »

From c40e305ca959f793075f0adfe72aabda7c4f5180 Mon Sep 17 00:00:00 2001 From: Masayuki Tanaka Date: Sat, 8 Feb 2014 22:22:17 +0900 Subject: [PATCH 30/31] Implement pie chart - #9 --- c3.css | 11 +- c3.js | 297 ++++++++++++++++++++++++++++++++++++++++++++++-------- c3.min.js | 154 ++++++++++++++-------------- 3 files changed, 344 insertions(+), 118 deletions(-) diff --git a/c3.css b/c3.css index df6f8d7..1dd1dd9 100644 --- a/c3.css +++ b/c3.css @@ -15,6 +15,15 @@ text { user-select: none; } +.chart-arc path { + stroke: #fff; + +} +.chart-arc text { + fill: #fff; + font-size: 13px; +} + /*-- Grid --*/ .grid line { @@ -60,7 +69,7 @@ text { /*-- Focus --*/ -.target.focused path { +.target.focused path.-line { stroke-width: 2px; } diff --git a/c3.js b/c3.js index 4950384..e09ead1 100644 --- a/c3.js +++ b/c3.js @@ -184,6 +184,7 @@ /*-- Set Chart Params --*/ var bottom, bottom2, right, left, top2, top3, margin, margin2, margin3, width, height, height2, height3, currentWidth, currentHeight; + var radius, radiusExpanded, svgArc, svgArcExpanded, svgArcExpandedSub, pie; var xMin, xMax, yMin, yMax, x, y, y2, subX, subY, subY2, xAxis, yAxis, yAxis2, subXAxis; var xOrient = __axis_rotated ? "left" : "bottom", @@ -197,7 +198,8 @@ legend : function () { return "translate(" + margin3.left + "," + margin3.top + ")"; }, y2 : function () { return "translate(" + (__axis_rotated ? 0 : width) + "," + (__axis_rotated ? 10 : 0) + ")"; }, x : function () { return "translate(0," + height + ")"; }, - subx : function () { return "translate(0," + height2 + ")"; } + subx : function () { return "translate(0," + height2 + ")"; }, + arc: function () { return "translate(" + width / 2 + "," + height / 2 + ")"; } }; /*-- Define Functions --*/ @@ -220,6 +222,8 @@ height = currentHeight - margin.top - margin.bottom; height2 = currentHeight - margin2.top - margin2.bottom; height3 = currentHeight - margin3.top - margin3.bottom; + radiusExpanded = height / 2; + radius = radiusExpanded * 0.95; } function getCurrentWidth() { return __size_width === null ? getParentWidth() : __size_width; @@ -286,6 +290,10 @@ yAxis = getYAxis(y, yOrient); yAxis2 = getYAxis(y2, y2Orient); subXAxis = getXAxis(subX, subXOrient); + // update for arc + svgArc = getSvgArc(); + svgArcExpanded = getSvgArcExpanded(); + svgArcExpandedSub = getSvgArcExpanded(0.98); } function getX(min, max, domain, offset) { @@ -357,6 +365,80 @@ return tickFormat; } + //-- Arc --// + + pie = d3.layout.pie().value(function (d) { + return d.values.reduce(function (a, b) { return a + b.value; }, 0); + }); + + function updateAngle(d) { + var found = false; + pie(c3.data.targets).forEach(function (t) { + if (! found && t.data.id === d.data.id) { + found = true; + d = t; + return; + } + }); + return found ? d : null; + } + + function getSvgArc() { + var arc = d3.svg.arc().outerRadius(radius).innerRadius(0), + newArc = function (d, withoutUpdate) { + var updated; + if (withoutUpdate) { return arc(d); } // for interpolate + updated = updateAngle(d); + return updated ? arc(updated) : "M 0 0"; + }; + // TODO: extends all function + newArc.centroid = arc.centroid; + return newArc; + } + function getSvgArcExpanded(rate) { + var arc = d3.svg.arc().outerRadius(radiusExpanded * (rate ? rate : 1)).innerRadius(0); + return function (d) { + var updated = updateAngle(d); + return updated ? arc(updated) : "M 0 0"; + }; + } + function getArc(d, withoutUpdate) { + return isArcType(d.data) ? svgArc(d, withoutUpdate) : "M 0 0"; + } + function transformForArcLable(d) { + var updated = updateAngle(d), c, x, y, h, translate = ""; + if (updated) { + c = svgArc.centroid(updated); + x = c[0], y = c[1], h = Math.sqrt(x * x + y * y); + translate = "translate(" + ((x / h) * radius * 0.8) + ',' + ((y / h) * radius * 0.8) + ")"; + } + return translate; + } + function textForArcLable(d) { + var ratio = 100 * (d.endAngle - d.startAngle) / (Math.PI * 2); + return ratio.toFixed(1) + "%"; + } + function expandArc(targetId, withoutFadeOut) { + var target = d3.selectAll('.chart-arc.target' + (targetId ? '-' + targetId : '')), + noneTargets = d3.selectAll('.-arc').filter(function (data) { return data.data.id !== targetId; }); + target.selectAll('path') + .transition().duration(50) + .attr("d", svgArcExpanded) + .transition().duration(100) + .attr("d", svgArcExpandedSub); + if (!withoutFadeOut) { + noneTargets.style("opacity", 0.3); + } + } + function unexpandArc(targetId) { + var target = d3.selectAll('.chart-arc.target' + (targetId ? '-' + targetId : '')); + target.selectAll('path') + .transition().duration(50) + .attr("d", svgArc); + d3.selectAll('.-arc') + .style("opacity", 1); + } + //-- Domain --// function getYDomainMin(targets) { @@ -473,6 +555,9 @@ function getXKey(id) { return __data_x ? __data_x : __data_xs ? __data_xs[id] : null; } + function getXValue(id, i) { + return id in c3.data.x && c3.data.x[i] ? c3.data.x[i] : i; + } function addName(data) { var name = __data_names[data.id]; @@ -536,7 +621,7 @@ x = parseDate(d[xKey]); } else if (isCustomX) { - x = d[xKey] ? d[xKey] : c3.data.x[id][i]; + x = d[xKey] ? d[xKey] : getXValue(id, i); } else { x = i; @@ -616,6 +701,7 @@ function classLine(d) { return classShapes(d) + " -line -line-" + d.id; } function classCircles(d) { return classShapes(d) + " -circles -circles-" + d.id; } function classBars(d) { return classShapes(d) + " -bars -bars-" + d.id; } + function classArc(d) { return classShapes(d.data) + " -arc -arc-" + d.data.id; } function classShape(d, i) { return "-shape -shape-" + i; } function classCircle(d, i) { return classShape(d, i) + " -circle -circle-" + i; } function classBar(d, i) { return classShape(d, i) + " -bar -bar-" + i; } @@ -724,7 +810,7 @@ function showXGridFocus(data) { // Hide when scatter plot exists - if (hasScatterType(c3.data.targets)) { return; } + if (hasScatterType(c3.data.targets) || hasArcType(c3.data.targets)) { return; } main.selectAll('line.xgrid-focus') .style("visibility", "visible") .data([data]) @@ -830,6 +916,9 @@ function hasScatterType(targets) { return hasType(targets, 'scatter'); } + function hasArcType(targets) { + return hasType(targets, 'pie'); + } function isLineType(d) { var id = (typeof d === 'string') ? d : d.id; return !(id in __data_types) || __data_types[id] === 'line' || __data_types[id] === 'spline'; @@ -846,6 +935,10 @@ var id = (typeof d === 'string') ? d : d.id; return __data_types[id] === 'scatter'; } + function isArcType(d) { + var id = (typeof d === 'string') ? d : d.id; + return __data_types[id] === 'pie'; + } /* not used function lineData(d) { return isLineType(d) ? d.values : []; @@ -1132,11 +1225,6 @@ // TODO: set names if names not specified - // Set data type if data.type is specified - if (__data_type) { - setTargetType(getTargetIds().filter(function (id) { return ! (id in __data_types); }), __data_type); - } - // Init sizes and scales updateSizes(); updateScales(); @@ -1315,6 +1403,11 @@ main.select(".chart").append("g") .attr("class", "chart-lines"); + // Define g for arc chart area + main.select(".chart").append("g") + .attr("class", "chart-arcs") + .attr("transform", translate.arc); + if (__zoom_enabled) { // TODO: __zoom_privileged here? // if zoom privileged, insert rect to forefront main.insert('rect', __zoom_privileged ? null : 'g.grid') @@ -1405,6 +1498,7 @@ .style("cursor", __data_selection_enabled && __data_selection_grouped ? "pointer" : null) .on('mouseover', function (d, i) { if (dragging) { return; } // do nothing if dragging + if (hasArcType(c3.data.targets)) { return; } var selectedData = c3.data.targets.map(function (d) { return addName(d.values[i]); }); var j, newData; @@ -1432,6 +1526,7 @@ showXGridFocus(selectedData[0]); }) .on('mouseout', function (d, i) { + if (hasArcType(c3.data.targets)) { return; } hideXGridFocus(); hideTooltip(); // Undo expanded shapes @@ -1442,6 +1537,7 @@ var selectedData; if (dragging) { return; } // do nothing when dragging + if (hasArcType(c3.data.targets)) { return; } // Show tooltip selectedData = c3.data.targets.map(function (d) { @@ -1478,6 +1574,7 @@ }); }) .on('click', function (d, i) { + if (hasArcType(c3.data.targets)) { return; } if (cancelClick) { cancelClick = false; return; @@ -1501,6 +1598,7 @@ .attr('height', height) .attr('class', "event-rect") .on('mouseout', function () { + if (hasArcType(c3.data.targets)) { return; } hideXGridFocus(); hideTooltip(); unexpandCircles(); @@ -1509,6 +1607,7 @@ var mouse, closest, selectedData; if (dragging) { return; } // do nothing when dragging + if (hasArcType(c3.data.targets)) { return; } mouse = d3.mouse(this); closest = findClosestFromTargets(c3.data.targets, mouse); @@ -1534,8 +1633,12 @@ } }) .on('click', function () { - var mouse = d3.mouse(this), - closest = findClosestFromTargets(c3.data.targets, mouse); + var mouse, closest; + + if (hasArcType(c3.data.targets)) { return; } + + mouse = d3.mouse(this); + closest = findClosestFromTargets(c3.data.targets, mouse); // select if selection enabled if (dist(closest, mouse) < 100) { @@ -1575,16 +1678,21 @@ } function drag(mouse) { + var sx, sy, mx, my, minX, maxX, minY, maxY; + + if (hasArcType(c3.data.targets)) { return; } if (! __data_selection_enabled) { return; } // do nothing if not selectable if (__zoom_enabled && ! zoom.altDomain) { return; } // skip if zoomable because of conflict drag dehavior - var sx = dragStart[0], sy = dragStart[1], - mx = mouse[0], - my = mouse[1], - minX = Math.min(sx, mx), - maxX = Math.max(sx, mx), - minY = (__data_selection_grouped) ? margin.top : Math.min(sy, my), - maxY = (__data_selection_grouped) ? height : Math.max(sy, my); + sx = dragStart[0]; + sy = dragStart[1]; + mx = mouse[0]; + my = mouse[1]; + minX = Math.min(sx, mx); + maxX = Math.max(sx, mx); + minY = (__data_selection_grouped) ? margin.top : Math.min(sy, my); + maxY = (__data_selection_grouped) ? height : Math.max(sy, my); + main.select('.dragarea') .attr('x', minX) .attr('y', minY) @@ -1621,6 +1729,7 @@ } function dragstart(mouse) { + if (hasArcType(c3.data.targets)) { return; } if (! __data_selection_enabled) { return; } // do nothing if not selectable dragStart = mouse; main.select('.chart').append('rect') @@ -1631,6 +1740,7 @@ } function dragend() { + if (hasArcType(c3.data.targets)) { return; } if (! __data_selection_enabled) { return; } // do nothing if not selectable main.select('.dragarea') .transition().duration(100) @@ -1650,6 +1760,7 @@ var barX, barY, barW, barH; var rectX, rectW; var withY, withSubchart, withTransition, withUpdateXDomain; + var isPieChart; var duration; options = isDefined(options) ? options : {}; @@ -1657,6 +1768,7 @@ withSubchart = isDefined(options.withSubchart) ? options.withSubchart : true; withTransition = isDefined(options.withTransition) ? options.withTransition : true; withUpdateXDomain = isDefined(options.withUpdateXDomain) ? options.withUpdateXDomain : false; + isPieChart = hasArcType(c3.data.targets); duration = withTransition ? 250 : 0; @@ -1668,9 +1780,10 @@ y.domain(getYDomain('y')); y2.domain(getYDomain('y2')); - main.select(".x.axis").transition().duration(__axis_rotated ? duration : 0).call(__axis_rotated ? yAxis : xAxis); - main.select(".y.axis").transition().duration(__axis_rotated ? 0 : duration).call(__axis_rotated ? xAxis : yAxis); - main.select(".y2.axis").transition().call(yAxis2); + // axis + main.select(".x.axis").transition().duration(__axis_rotated ? duration : 0).call(__axis_rotated ? yAxis : xAxis).style("opacity", isPieChart ? 0 : 1); + main.select(".y.axis").transition().duration(__axis_rotated ? 0 : duration).call(__axis_rotated ? xAxis : yAxis).style("opacity", isPieChart ? 0 : 1); + main.select(".y2.axis").transition().call(yAxis2).style("opacity", isPieChart ? 0 : 1); // Update label position main.select(".x.axis .-axis-x-label").attr("x", width); @@ -1763,7 +1876,7 @@ .remove(); // lines and cricles - main.selectAll('.-line') + main.selectAll('.chart-line').select('.-line') .transition().duration(duration) .attr("d", lineOnMain); mainCircle = main.selectAll('.-circles').selectAll('.-circle') @@ -1780,6 +1893,35 @@ .attr("r", __point_r); mainCircle.exit().remove(); + // arc + main.selectAll('.chart-arc').select('.-arc') + .style("opacity", function (d) { return d === this._current ? 0 : 1; }) + .transition().duration(duration) + .attrTween("d", function (d) { + var updated = updateAngle(d); + if (! updated) { + return function () { return "M 0 0"; }; + } +/* + if (this._current === d) { + this._current = { + startAngle: Math.PI*2, + endAngle: Math.PI*2, + }; + } +*/ + var i = d3.interpolate(this._current, updated); + this._current = i(0); + return function (t) { return getArc(i(t), true); }; + }) + .style("opacity", 1); + main.selectAll('.chart-arc').select('text') + .attr("transform", transformForArcLable) + .attr("opacity", 0) + .transition().duration(duration) + .text(textForArcLable) + .attr("opacity", function (d) { return isArcType(d.data) ? 1 : 0; }); + // subchart if (__subchart_show) { // reflect main chart to extent on subchart if zoomed @@ -1910,6 +2052,7 @@ // Update main positions main.select('.x.axis').attr("transform", translate.x); main.select('.y2.axis').attr("transform", translate.y2); + main.select('.chart-arcs').attr("transform", translate.arc); // Update context sizes and positions if (__subchart_show) { context.select('.x.brush').selectAll('rect').attr('height', height2); @@ -1926,11 +2069,16 @@ } function updateTargets(targets) { - var mainLineEnter, mainLineUpdate, mainBarEnter, mainBarUpdate; + var mainLineEnter, mainLineUpdate, mainBarEnter, mainBarUpdate, mainPieEnter, mainPieUpdate; var contextLineEnter, contextLineUpdate, contextBarEnter, contextBarUpdate; /*-- Main --*/ + // Set data type if data.type is specified + if (__data_type) { + setTargetType(getTargetIds(targets).filter(function (id) { return ! (id in __data_types); }), __data_type); + } + //-- Bar --// mainBarUpdate = main.select('.chart-bars') .selectAll('.chart-bar') @@ -1972,6 +2120,36 @@ d.value = t.values[d.x].value; }); }); + // MEMO: can not keep same color... + //mainLineUpdate.exit().remove(); + + //-- Pie --// + + mainPieUpdate = main.select('.chart-arcs') + .selectAll(".chart-arc") + .data(pie(targets)); + mainPieEnter = mainPieUpdate.enter().append("g") + .attr("class", function (d) { return 'chart-arc target target-' + d.data.id; }) + .style('opacity', 0); + mainPieEnter.append("path") + .attr("class", classArc) + .style("fill", function (d) { return color(d.data.id); }) + .style("cursor", function (d) { return __data_selection_isselectable(d) ? "pointer" : null; }) + .each(function (d) { this._current = d; }) + .on('mouseover', function (d) { + expandArc(d.data.id); + focusLegend(d.data.id); + }) + .on('mouseout', function (d) { + unexpandArc(d.data.id); + revertLegend(); + }); + mainPieEnter.append("text") + .attr("dy", ".35em") + .style("text-anchor", "middle") + .style("pointer-events", "none"); + // MEMO: can not keep same color..., but not bad to update color in redraw + //mainPieUpdate.exit().remove(); /*-- Context --*/ @@ -2039,6 +2217,17 @@ /*-- Draw Legend --*/ + function focusLegend(id) { + d3.selectAll('.legend-item').filter(function (d) { return d !== id; }) + .transition().duration(100) + .style('opacity', 0.3); + } + function revertLegend() { + d3.selectAll('.legend-item') + .transition().duration(100) + .style('opacity', 1); + } + function updateLegend(targets, options) { var ids = getTargetIds(targets), l; var padding = width / 2 - __legend_item_width * Object.keys(targets).length / 2; @@ -2058,15 +2247,11 @@ __legend_item_onclick(d); }) .on('mouseover', function (d) { - d3.selectAll('.legend-item').filter(function (_d) { return _d !== d; }) - .transition().duration(100) - .style('opacity', 0.3); + focusLegend(d); c3.focus(d); }) .on('mouseout', function () { - d3.selectAll('.legend-item') - .transition().duration(100) - .style('opacity', 1); + revertLegend(); c3.revert(); }); l.append('rect') @@ -2078,6 +2263,7 @@ .attr('height', 24); l.append('rect') .attr("class", "legend-item-tile") + .style("pointer-events", "none") .style('fill', function (d) { return color(d); }) .attr('x', -200) .attr('y', function () { return legendHeight / 2 - 9; }) @@ -2085,6 +2271,7 @@ .attr('height', 10); l.append('text') .text(function (d) { return isDefined(__data_names[d]) ? __data_names[d] : d; }) + .style("pointer-events", "none") .attr('x', -200) .attr('y', function () { return legendHeight / 2; }); @@ -2109,30 +2296,54 @@ function getTargetSelector(target) { return isDefined(target) ? '.target-' + target : '.target'; } + function isNoneArc(d) { + return hasTarget(d.id); + } + function isArc(d) { + return 'data' in d && hasTarget(d.data.id); + } c3.focus = function (target) { + var candidates = d3.selectAll(getTargetSelector(target)), + candidatesForNoneArc = candidates.filter(isNoneArc), + candidatesForArc = candidates.filter(isArc); + function focus(targets) { + targets.transition().duration(100).style('opacity', 1); + } c3.defocus(); - d3.selectAll(getTargetSelector(target)) - .filter(function (d) { return hasTarget(d.id); }) - .classed('focused', true) - .transition().duration(100) - .style('opacity', 1); + focus(candidatesForNoneArc.classed('focused', true)); + focus(candidatesForArc); + if (hasArcType(c3.data.targets)) { + expandArc(target, true); + } }; c3.defocus = function (target) { - d3.selectAll(getTargetSelector(target)) - .filter(function (d) { return hasTarget(d.id); }) - .classed('focused', false) - .transition().duration(100) - .style('opacity', 0.3); + var candidates = d3.selectAll(getTargetSelector(target)), + candidatesForNoneArc = candidates.filter(isNoneArc), + candidatesForArc = candidates.filter(isArc); + function defocus(targets) { + targets.transition().duration(100).style('opacity', 0.3); + } + defocus(candidatesForNoneArc.classed('focused', false)); + defocus(candidatesForArc); + if (hasArcType(c3.data.targets)) { + unexpandArc(target); + } }; c3.revert = function (target) { - d3.selectAll(getTargetSelector(target)) - .filter(function (d) { return hasTarget(d.id); }) - .classed('focused', false) - .transition().duration(100) - .style('opacity', 1); + var candidates = d3.selectAll(getTargetSelector(target)), + candidatesForNoneArc = candidates.filter(isNoneArc), + candidatesForArc = candidates.filter(isArc); + function revert(targets) { + targets.transition().duration(100).style('opacity', 1); + } + revert(candidatesForNoneArc.classed('focused', false)); + revert(candidatesForArc); + if (hasArcType(c3.data.targets)) { + unexpandArc(target); + } }; c3.show = function (target) { diff --git a/c3.min.js b/c3.min.js index 4966bbc..0fe68b3 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,74 +1,80 @@ -(function(P){function Sc(){function n(c,e){c.attr("transform",function(c){return"translate("+(e(c)+aa)+", 0)"})}function t(c,e){c.attr("transform",function(c){return"translate(0,"+e(c)+")"})}function P(c){var e=c[0];c=c[c.length-1];return ea?0:a}function ec(a){return qa&&a===qa||X&&hd(X,a)}function id(a){return!ec(a)}function eb(a){var b=Ja[a.id];a.name=n(b)?b:a.id;return a}function fc(a){var b=a[0],d={},f=[],u,c;for(u=1;u -v[d].indexOf(c.id)))for(f=0;fb?a-b:0};return function(a){var c=b?S(a.id):E(a.id);return d(c(a.value))}}function Na(a,b){var d=t(a)?fb():a;"string"===typeof d&&(d=[d]);for(var f=0;f=e;e+=s)h+=f(a[c-1],a[c],e,l)}return h}function Db(a){var b,d;hb=c.select(wa);if(hb.empty())P.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{hb.html("");h.data.x={};h.data.targets=Ka(a);Gc&&Na(fb().filter(function(a){return!(a in O)}),Gc);ua();Mb();m.domain(c.extent(Va()));w.domain(ka("y"));U.domain(ka("y2"));da.domain(m.domain()); -Za.domain(w.domain());$a.domain(U.domain());B.ticks(10>a.length?a.length:10);na.ticks(ud).outerTickSize(0).tickFormat(vd);ab.ticks(wd).outerTickSize(0).tickFormat(xd);V=m.domain();G.x(da);ra&&C.x(m);Pa=c.select(wa).append("svg").attr("width",q+A+ca).attr("height",p+s+F).on("mouseenter",yd).on("mouseleave",zd);ib=Pa.append("defs");ib.append("clipPath").attr("id",Eb).append("rect").attr("y",s).attr("width",q).attr("height",p-s);ib.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1- -A).attr("y",-20).attr("width",R).attr("height",Q);ib.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-A+1).attr("y",s-1).attr("width",ja).attr("height",nb);k=Pa.append("g").attr("transform",J.main);x=ya?Pa.append("g").attr("transform",J.context):null;za=Aa?Pa.append("g").attr("transform",J.legend):null;N=c.select(wa).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path", -g?"":"url(#xaxis-clip)").attr("transform",J.x).call(g?na:B).append("text").attr("class","-axis-x-label").attr("x",q).attr("dy","-.5em").style("text-anchor","end").text(Ad);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?B:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(Bd);Tb&&k.append("g").attr("class","y2 axis").attr("transform",J.y2).call(ab);b=k.append("g").attr("clip-path",Qa).attr("class", -"grid");Hc&&b.append("g").attr("class","xgrids");Fb&&(d=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Fb).enter().append("g").attr("class","xgrid-line"),d.append("line").attr("class",function(a){return""+a["class"]}),d.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g?0:-s).attr("dy",-6).text(function(a){return a.text}));Cd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class", -"xgrid-focus").attr("x1",g?0:-10).attr("x2",g?q:-10).attr("y1",g?-10:s).attr("y2",g?-10:p);Ic&&b.append("g").attr("class","ygrids");Gb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Gb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Qa).attr("class","regions");k.append("g").attr("clip-path",Qa).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor", -ra?"ew-resize":null);X?Dd(b):Ed(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");if(ra)k.insert("rect",Fd?null:"g.grid").attr("class","zoom-rect").attr("width",q).attr("height",p).style("opacity",0).style("cursor","ew-resize").call(C).on("dblclick.zoom",null);null!==jb&&G.extent("function"!==typeof jb?jb:jb(ea,oa));ya&&(x.append("g").attr("clip-path",Qa).attr("class","chart"),x.select(".chart").append("g").attr("class","chart-bars"), -x.select(".chart").append("g").attr("class","chart-lines"),x.append("g").attr("clip-path",Qa).attr("class","x brush").call(G).selectAll("rect").attr("height",ma),x.append("g").attr("class","x axis").attr("transform",J.subx).call(Ea));Aa&&kb(h.data.targets);Jc(h.data.targets);z({withTransition:!1,withUpdateXDomain:!0});if(Gd){if(r&&"string"===typeof Ba){Ba=pa(Ba);for(a=0;awb(d,a)?c.select(".event-rect").style("cursor","pointer"):c.select(".event-rect").style("cursor", -null))}).on("click",function(){var a=c.mouse(this),d=oc(h.data.targets,a);100>wb(d,a)&&k.select(".-circles-"+d.id).select(".-circle-"+d.index).each(function(){Lc(this,d,d.index)})}).call(c.behavior.drag().origin(Object).on("drag",function(){Mc(c.mouse(this))}).on("dragstart",function(){Nc(c.mouse(this))}).on("dragend",function(){Oc()})).call(C).on("dblclick.zoom",null)}function Lc(a,b,d){var f=c.select(a),e=f.classed(ia),g=!1,h;"circle"===a.nodeName?(g=xc(a,1.5*Oa),h=Ac):"rect"===a.nodeName&&(g=yc(a), -h=Cc);if(sa||g)ha&&ta(b)&&(f.classed(ia,!e),h(!e,f,b,d)),Id(b,f)}function Mc(a){if(ha&&(!ra||C.altDomain)){var b=Kb[0],d=Kb[1],f=a[0];a=a[1];var e=Math.min(b,f),g=Math.max(b,f),h=sa?s:Math.min(d,a),m=sa?p:Math.max(d,a);k.select(".dragarea").attr("x",e).attr("y",h).attr("width",g-e).attr("height",m-h);k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ta(a)}).each(function(a,b){var d=c.select(this),f=d.classed(ia),k=d.classed(Lb),l,n,p,q;l=!1;"circle"===this.nodeName?(l=1*d.attr("cx"), -n=1*d.attr("cy"),q=Ac,l=e", -d,c,e;for(d=0;d"+e+""+c+"";return b+""}),Gd=e(["tooltip","init","show"],!1),Ba=e(["tooltip","init","x"],0),Kc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Eb=wa.replace("#","")+"-clip",Qa="url(#"+Eb+")",r="timeseries"===Rc,W="categorized"=== -Rc,tb=!r&&(qa||X),Kb=null,Ra=!1,Jb=!1,la=Aa?40:0,Y=function(a,b){var d=[],c=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in a)return a[b];-1===d.indexOf(b)&&d.push(b);return c[d.indexOf(b)%c.length]}}(Od,Pd),$c=function(){var a=[[c.time.format("%Y/%-m/%-d"),function(){return!0}],[c.time.format("%-m/%-d"),function(a){return a.getMonth()}],[c.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[c.time.format("%-m/%-d"), -function(a){return a.getDay()&&1!==a.getDate()}],[c.time.format("%I %p"),function(a){return a.getHours()}],[c.time.format("%I:%M"),function(a){return a.getMinutes()}],[c.time.format(":%S"),function(a){return a.getSeconds()}],[c.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,e=a[c];!e[1](b);)e=a[--c];return e[0](b)}}(),Pb,Wb,Rb,Ya,Vb,Xb,q,p,ma,ob,va,Zb,$b,rb,sb,m,w,U,da,Za,$a,B,na,ab,Ea,Vc=g?"left":"bottom",Wc=g?qb?"top":"bottom":qb?"right":"left", -Xc=g?pb?"bottom":"top":pb?"left":"right",Yc="bottom",J={main:function(){return"translate("+A+","+s+")"},context:function(){return"translate("+l+","+Ca+")"},legend:function(){return"translate("+Ob+","+Nb+")"},y2:function(){return"translate("+(g?0:q)+","+(g?10:0)+")"},x:function(){return"translate(0,"+p+")"},subx:function(){return"translate(0,"+ma+")"}},Kd=function(){var a=c.svg.line().x(g?function(a){return E(a.id)(a.value)}:gb).y(g?gb:function(a){return E(a.id)(a.value)});return function(b){var c= -Dc(b.values),e;if(xb(b))return"spline"===O["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),Qc[b.id]?td(c,m,E(b.id),Qc[b.id]):a(c);e=m(c[0].x);b=E(b.id)(c[0].value);return g?"M "+b+" "+e:"M "+e+" "+b}}(),Ld=function(){var a=c.svg.line().x(function(a){return da(a.x)}).y(function(a){return S(a.id)(a.value)});return function(b){var c=Dc(b.values);return xb(b)?a(c):"M "+da(c[0].x)+" "+S(b.id)(c[0].value)}}(),G=c.svg.brush().on("brush",function(){z({withTransition:!1,withY:!1, -withSubchart:!1,withUpdateXDomain:!0})}),C=c.behavior.zoom().on("zoomstart",function(){C.altDomain=c.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ra?Md:null);G.update=function(){x&&x.select(".x.brush").call(this);return this};C.orgScaleExtent=function(){var a=Pc?Pc:[1,10];return[a[0],Math.max(La()/a[1],a[1])]};C.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(V[1]-V[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Pa,ib,k,x,za,N,hb,ea=null, -oa=null,V;h.focus=function(a){h.defocus();c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused",!0).transition().duration(100).style("opacity",1)};h.defocus=function(a){c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",0.3)};h.revert=function(a){c.selectAll(Ua(a)).filter(function(a){return ub(a.id)}).classed("focused",!1).transition().duration(100).style("opacity",1)};h.show=function(a){c.selectAll(Ua(a)).transition().style("opacity", -1)};h.hide=function(a){c.selectAll(Ua(a)).transition().style("opacity",0)};h.unzoom=function(){G.clear().update();z({withUpdateXDomain:!0})};h.load=function(a){t(a.done)&&(a.done=function(){});"categories"in a&&W&&(Fa=a.categories,B.categories(Fa));if("cacheIds"in a&&Wa(a.cacheIds))Sa(mb(a.cacheIds),a.done);else if("data"in a)Sa(Ka(a.data),a.done);else if("url"in a)c.csv(a.url,function(b,c){Sa(Ka(c),a.done)});else if("rows"in a)Sa(Ka(fc(a.rows)),a.done);else if("columns"in a)Sa(Ka(gc(a.columns)), -a.done);else throw Error("url or rows or columns is required.");};h.unload=function(a){h.data.targets=h.data.targets.filter(function(b){return b.id!==a});c.selectAll(".target-"+a).transition().style("opacity",0).remove();Aa&&(c.selectAll(".legend-item-"+a).remove(),kb(h.data.targets));0b.classes.indexOf(a)})});return K};h.data.get=function(a){a=h.data.getAsTarget(a);return n(a)?a.values.map(function(a){return a.value}):void 0};h.data.getAsTarget=function(a){var b=cb(function(b){return b.id===a});return 0a?0:a}function qc(a){return sa&&a===sa||aa&&Bd(aa,a)}function Cd(a){return!qc(a)}function lb(a){var b=Na[a.id];a.name=p(b)?b:a.id;return a}function rc(a){var b=a[0],c={},h=[],d,J;for(d=1;du[c].indexOf(d.id)))for(h=0;hb?a-b:0};return function(a){var d=b?W(a.id):H(a.id);return c(d(a.value))}}function Ra(a,b){var c=t(a)?mb():a;"string"===typeof c&&(c=[c]);for(var h=0;h=f;f+=u)k+=d(a[e-1],a[e],f,n)}return k}function Mb(a){var b,c;pb=d.select(ya);if(pb.empty())T.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".'); +else{pb.html("");f.data.x={};f.data.targets=Oa(a);wa();Xb();m.domain(d.extent(yd()));x.domain(ib("y"));Y.domain(ib("y2"));fa.domain(m.domain());db.domain(x.domain());eb.domain(Y.domain());D.ticks(10>a.length?a.length:10);pa.ticks(Pd).outerTickSize(0).tickFormat(Qd);fb.ticks(Rd).outerTickSize(0).tickFormat(Sd);Z=m.domain();K.x(fa);ta&&E.x(m);Ta=d.select(ya).append("svg").attr("width",n+C+ea).attr("height",r+q+I).on("mouseenter",Td).on("mouseleave",Ud);qb=Ta.append("defs");qb.append("clipPath").attr("id", +Nb).append("rect").attr("y",q).attr("width",n).attr("height",r-q);qb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-C).attr("y",-20).attr("width",V).attr("height",U);qb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-C+1).attr("y",q-1).attr("width",ma).attr("height",tb);k=Ta.append("g").attr("transform",F.main);y=za?Ta.append("g").attr("transform",F.context):null;Aa=Ba?Ta.append("g").attr("transform",F.legend):null;R=d.select(ya).style("position","relative").append("div").style("position", +"absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",F.x).call(g?pa:D).append("text").attr("class","-axis-x-label").attr("x",n).attr("dy","-.5em").style("text-anchor","end").text(Vd);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?D:pa).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(Wd);dc&& +k.append("g").attr("class","y2 axis").attr("transform",F.y2).call(fb);b=k.append("g").attr("clip-path",Ua).attr("class","grid");Uc&&b.append("g").attr("class","xgrids");Ob&&(c=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Ob).enter().append("g").attr("class","xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g? +0:-q).attr("dy",-6).text(function(a){return a.text}));Xd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2",g?n:-10).attr("y1",g?-10:q).attr("y2",g?-10:r);Vc&&b.append("g").attr("class","ygrids");Pb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Pb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Ua).attr("class","regions");k.append("g").attr("clip-path", +Ua).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",ta?"ew-resize":null);aa?Yd(b):Zd(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");k.select(".chart").append("g").attr("class","chart-arcs").attr("transform",F.arc);if(ta)k.insert("rect",$d?null:"g.grid").attr("class","zoom-rect").attr("width",n).attr("height",r).style("opacity",0).style("cursor","ew-resize").call(E).on("dblclick.zoom", +null);null!==rb&&K.extent("function"!==typeof rb?rb:rb(ga,qa));za&&(y.append("g").attr("clip-path",Ua).attr("class","chart"),y.select(".chart").append("g").attr("class","chart-bars"),y.select(".chart").append("g").attr("class","chart-lines"),y.append("g").attr("clip-path",Ua).attr("class","x brush").call(K).selectAll("rect").attr("height",oa),y.append("g").attr("class","x axis").attr("transform",F.subx).call(Ia));Ba&&sb(f.data.targets);Wc(f.data.targets);B({withTransition:!1,withUpdateXDomain:!0}); +if(ae){if(z&&"string"===typeof Ca){Ca=ra(Ca);for(a=0;aFb(c,a)?d.select(".event-rect").style("cursor","pointer"):d.select(".event-rect").style("cursor",null))}).on("click",function(){var a,c;A(f.data.targets)||(a=d.mouse(this),c=Bc(f.data.targets,a),100>Fb(c,a)&&k.select(".-circles-"+c.id).select(".-circle-"+c.index).each(function(){Yc(this, +c,c.index)}))}).call(d.behavior.drag().origin(Object).on("drag",function(){Zc(d.mouse(this))}).on("dragstart",function(){$c(d.mouse(this))}).on("dragend",function(){ad()})).call(E).on("dblclick.zoom",null)}function Yc(a,b,c){var e=d.select(a),f=e.classed(la),g=!1,k;"circle"===a.nodeName?(g=Lc(a,1.5*Sa),k=Oc):"rect"===a.nodeName&&(g=Mc(a),k=Qc);if(ua||g)ja&&ka(b)&&(e.classed(la,!f),k(!f,e,b,c)),ce(b,e)}function Zc(a){var b,c,e,g,m,v,l;A(f.data.targets)||!ja||ta&&!E.altDomain||(b=Tb[0],c=Tb[1],e=a[0], +a=a[1],g=Math.min(b,e),m=Math.max(b,e),v=ua?q:Math.min(c,a),l=ua?r:Math.max(c,a),k.select(".dragarea").attr("x",g).attr("y",v).attr("width",m-g).attr("height",l-v),k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ka(a)}).each(function(a,b){var c=d.select(this),e=c.classed(la),h=c.classed(Ub),f,k,p,n;f=!1;"circle"===this.nodeName?(f=1*c.attr("cx"),k=1*c.attr("cy"),n=Oc,f=g",c,d,e;for(c=0;c"+e+""+d+"";return b+""}),ae=e(["tooltip","init","show"],!1),Ca=e(["tooltip","init","x"],0),Xc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Nb=ya.replace("#","")+"-clip",Ua="url(#"+Nb+")",z="timeseries"===gd,$="categorized"===gd,Eb=!z&&(sa||aa),Tb=null,Va=!1,Sb=!1,na=Ba?40:0,S=function(a,b){var c=[],d=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" "); +return function(b){if(b in a)return a[b];-1===c.indexOf(b)&&c.push(b);return d[c.indexOf(b)%d.length]}}(ie,je),pd=function(){var a=[[d.time.format("%Y/%-m/%-d"),function(){return!0}],[d.time.format("%-m/%-d"),function(a){return a.getMonth()}],[d.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[d.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[d.time.format("%I %p"),function(a){return a.getHours()}],[d.time.format("%I:%M"),function(a){return a.getMinutes()}],[d.time.format(":%S"), +function(a){return a.getSeconds()}],[d.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,d=a[c];!d[1](b);)d=a[--c];return d[0](b)}}(),$b,gc,bc,bb,fc,hc,n,r,oa,ub,xa,cb,xb,gb,lc,mc,Ab,jc,kc,yb,zb,m,x,Y,fa,db,eb,D,pa,fb,Ia,kd=g?"left":"bottom",ld=g?wb?"top":"bottom":wb?"right":"left",md=g?vb?"bottom":"top":vb?"left":"right",nd="bottom",F={main:function(){return"translate("+C+","+q+")"},context:function(){return"translate("+l+","+Da+")"},legend:function(){return"translate("+ +Zb+","+Yb+")"},y2:function(){return"translate("+(g?0:n)+","+(g?10:0)+")"},x:function(){return"translate(0,"+r+")"},subx:function(){return"translate(0,"+oa+")"},arc:function(){return"translate("+n/2+","+r/2+")"}};Ab=d.layout.pie().value(function(a){return a.values.reduce(function(a,c){return a+c.value},0)});var ee=function(){var a=d.svg.line().x(g?function(a){return H(a.id)(a.value)}:ob).y(g?ob:function(a){return H(a.id)(a.value)});return function(b){var c=Rc(b.values),d;if(Gb(b))return"spline"=== +N["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),fd[b.id]?Od(c,m,H(b.id),fd[b.id]):a(c);d=m(c[0].x);b=H(b.id)(c[0].value);return g?"M "+b+" "+d:"M "+d+" "+b}}(),fe=function(){var a=d.svg.line().x(function(a){return fa(a.x)}).y(function(a){return W(a.id)(a.value)});return function(b){var c=Rc(b.values);return Gb(b)?a(c):"M "+fa(c[0].x)+" "+W(b.id)(c[0].value)}}(),K=d.svg.brush().on("brush",function(){B({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}), +E=d.behavior.zoom().on("zoomstart",function(){E.altDomain=d.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ta?ge:null);K.update=function(){y&&y.select(".x.brush").call(this);return this};E.orgScaleExtent=function(){var a=ed?ed:[1,10];return[a[0],Math.max(Pa()/a[1],a[1])]};E.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(Z[1]-Z[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Ta,qb,k,y,Aa,R,pb,ga=null,qa=null,Z;f.focus=function(a){var b=d.selectAll(Ya(a)), +c=b.filter(Vb),b=b.filter(Wb);f.defocus();c.classed("focused",!0).transition().duration(100).style("opacity",1);b.transition().duration(100).style("opacity",1);A(f.data.targets)&&Ga(a,!0)};f.defocus=function(a){var b=d.selectAll(Ya(a)),c=b.filter(Vb),b=b.filter(Wb);c.classed("focused",!1).transition().duration(100).style("opacity",0.3);b.transition().duration(100).style("opacity",0.3);A(f.data.targets)&&Ha(a)};f.revert=function(a){var b=d.selectAll(Ya(a)),c=b.filter(Vb),b=b.filter(Wb);c.classed("focused", +!1).transition().duration(100).style("opacity",1);b.transition().duration(100).style("opacity",1);A(f.data.targets)&&Ha(a)};f.show=function(a){d.selectAll(Ya(a)).transition().style("opacity",1)};f.hide=function(a){d.selectAll(Ya(a)).transition().style("opacity",0)};f.unzoom=function(){K.clear().update();B({withUpdateXDomain:!0})};f.load=function(a){t(a.done)&&(a.done=function(){});"categories"in a&&$&&(Ja=a.categories,D.categories(Ja));if("cacheIds"in a&&zd(a.cacheIds))Wa(Ad(a.cacheIds),a.done);else if("data"in +a)Wa(Oa(a.data),a.done);else if("url"in a)d.csv(a.url,function(b,c){Wa(Oa(c),a.done)});else if("rows"in a)Wa(Oa(rc(a.rows)),a.done);else if("columns"in a)Wa(Oa(sc(a.columns)),a.done);else throw Error("url or rows or columns is required.");};f.unload=function(a){f.data.targets=f.data.targets.filter(function(b){return b.id!==a});d.selectAll(".target-"+a).transition().style("opacity",0).remove();Ba&&(d.selectAll(".legend-item-"+a).remove(),sb(f.data.targets));0b.classes.indexOf(a)})});return O};f.data.get=function(a){a=f.data.getAsTarget(a);return p(a)?a.values.map(function(a){return a.value}):void 0};f.data.getAsTarget=function(a){var b= +jb(function(b){return b.id===a});return 0 Date: Sun, 9 Feb 2014 00:30:18 +0900 Subject: [PATCH 31/31] Fix axis update when data loading --- c3.js | 44 ++++++++++----- c3.min.js | 161 +++++++++++++++++++++++++++--------------------------- 2 files changed, 111 insertions(+), 94 deletions(-) diff --git a/c3.js b/c3.js index e09ead1..c05551e 100644 --- a/c3.js +++ b/c3.js @@ -502,8 +502,16 @@ } return (domain[1] - domain[0]) / (extent[1] - extent[0]); } - function getDefaultXDomain() { - var padding = isCategorized ? 0 : Math.abs(firstX - lastX) * 0.01, + function getXDomainMin(targets) { + return d3.min(targets, function (t) { return d3.min(t.values, function (v) { return v.x; }); }); + } + function getXDomainMax(targets) { + return d3.max(targets, function (t) { return d3.max(t.values, function (v) { return v.x; }); }); + } + function getXDomain(targets) { + var xDomain = [getXDomainMin(targets), getXDomainMax(targets)], + firstX = xDomain[0], lastX = xDomain[1], + padding = isCategorized ? 0 : Math.abs(firstX - lastX) * 0.01, min = isTimeSeries ? new Date(firstX.getTime() - padding) : firstX - padding, max = isTimeSeries ? new Date(lastX.getTime() + padding) : lastX + padding; return [min, max]; @@ -626,10 +634,6 @@ else { x = i; } - - if (x < firstX || firstX === null) { firstX = x; } - if (lastX < x) { lastX = x; } - d.x = x; // used by event-rect return {x: x, value: d[id] !== null && !isNaN(d[id]) ? +d[id] : null, id: convertedId}; @@ -1205,7 +1209,7 @@ var svg, defs, main, context, legend, tooltip, selectChart; // for brush area culculation - var firstX = null, lastX = null, orgXDomain; + var orgXDomain; function init(data) { var eventRect, grid, xgridLine; @@ -1230,7 +1234,7 @@ updateScales(); // Set domains for each scale - x.domain(d3.extent(getDefaultXDomain())); + x.domain(d3.extent(getXDomain(c3.data.targets))); y.domain(getYDomain('y')); y2.domain(getYDomain('y2')); subX.domain(x.domain()); @@ -1421,7 +1425,7 @@ // Set default extent if defined if (__axis_x_default !== null) { - brush.extent(typeof __axis_x_default !== 'function' ? __axis_x_default : __axis_x_default(firstX, lastX)); + brush.extent(typeof __axis_x_default !== 'function' ? __axis_x_default : __axis_x_default(getXDomain())); } /*-- Context Region --*/ @@ -1759,7 +1763,7 @@ var barIndices = getBarIndices(), barTargetsNum = barIndices.__max__ + 1; var barX, barY, barW, barH; var rectX, rectW; - var withY, withSubchart, withTransition, withUpdateXDomain; + var withY, withSubchart, withTransition, withUpdateXDomain, withUpdateOrgXDomain; var isPieChart; var duration; @@ -1768,10 +1772,19 @@ withSubchart = isDefined(options.withSubchart) ? options.withSubchart : true; withTransition = isDefined(options.withTransition) ? options.withTransition : true; withUpdateXDomain = isDefined(options.withUpdateXDomain) ? options.withUpdateXDomain : false; + withUpdateOrgXDomain = isDefined(options.withUpdateOrgXDomain) ? options.withUpdateOrgXDomain : false; isPieChart = hasArcType(c3.data.targets); duration = withTransition ? 250 : 0; + if (withUpdateOrgXDomain) { + x.domain(d3.extent(getXDomain(c3.data.targets))); + orgXDomain = x.domain(); + zoom.x(x).updateScaleExtent(); + subX.domain(x.domain()); + brush.x(subX); + } + // ATTENTION: call here to update tickOffset if (withUpdateXDomain) { x.domain(brush.empty() ? orgXDomain : brush.extent()); @@ -1802,8 +1815,9 @@ if (__grid_x_show) { if (__grid_x_type === 'year') { xgridData = []; - var firstYear = firstX.getFullYear(); - var lastYear = lastX.getFullYear(); + var xDomain = getXDomain(); + var firstYear = xDomain[0].getFullYear(); + var lastYear = xDomain[1].getFullYear(); for (var year = firstYear; year <= lastYear; year++) { xgridData.push(new Date(year + '-01-01 00:00:00')); } @@ -2210,7 +2224,7 @@ updateTargets(c3.data.targets); // Redraw with new targets - redraw(); + redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true}); done(); } @@ -2412,7 +2426,9 @@ updateLegend(c3.data.targets); } - if (c3.data.targets.length > 0) { redraw(); } + if (c3.data.targets.length > 0) { + redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true}); + } }; c3.selected = function (target) { diff --git a/c3.min.js b/c3.min.js index 0fe68b3..599eec7 100644 --- a/c3.min.js +++ b/c3.min.js @@ -1,80 +1,81 @@ -(function(T){function hd(){function p(d,e){d.attr("transform",function(d){return"translate("+(e(d)+da)+", 0)"})}function t(d,e){d.attr("transform",function(d){return"translate(0,"+e(d)+")"})}function T(d){var e=d[0];d=d[d.length-1];return ea?0:a}function qc(a){return sa&&a===sa||aa&&Bd(aa,a)}function Cd(a){return!qc(a)}function lb(a){var b=Na[a.id];a.name=p(b)?b:a.id;return a}function rc(a){var b=a[0],c={},h=[],d,J;for(d=1;du[c].indexOf(d.id)))for(h=0;hb?a-b:0};return function(a){var d=b?W(a.id):H(a.id);return c(d(a.value))}}function Ra(a,b){var c=t(a)?mb():a;"string"===typeof c&&(c=[c]);for(var h=0;h=f;f+=u)k+=d(a[e-1],a[e],f,n)}return k}function Mb(a){var b,c;pb=d.select(ya);if(pb.empty())T.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".'); -else{pb.html("");f.data.x={};f.data.targets=Oa(a);wa();Xb();m.domain(d.extent(yd()));x.domain(ib("y"));Y.domain(ib("y2"));fa.domain(m.domain());db.domain(x.domain());eb.domain(Y.domain());D.ticks(10>a.length?a.length:10);pa.ticks(Pd).outerTickSize(0).tickFormat(Qd);fb.ticks(Rd).outerTickSize(0).tickFormat(Sd);Z=m.domain();K.x(fa);ta&&E.x(m);Ta=d.select(ya).append("svg").attr("width",n+C+ea).attr("height",r+q+I).on("mouseenter",Td).on("mouseleave",Ud);qb=Ta.append("defs");qb.append("clipPath").attr("id", -Nb).append("rect").attr("y",q).attr("width",n).attr("height",r-q);qb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-C).attr("y",-20).attr("width",V).attr("height",U);qb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-C+1).attr("y",q-1).attr("width",ma).attr("height",tb);k=Ta.append("g").attr("transform",F.main);y=za?Ta.append("g").attr("transform",F.context):null;Aa=Ba?Ta.append("g").attr("transform",F.legend):null;R=d.select(ya).style("position","relative").append("div").style("position", -"absolute").style("z-index","10").style("display","none");k.append("g").attr("class","x axis").attr("clip-path",g?"":"url(#xaxis-clip)").attr("transform",F.x).call(g?pa:D).append("text").attr("class","-axis-x-label").attr("x",n).attr("dy","-.5em").style("text-anchor","end").text(Vd);k.append("g").attr("class","y axis").attr("clip-path",g?"url(#yaxis-clip)":"").call(g?D:pa).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(Wd);dc&& -k.append("g").attr("class","y2 axis").attr("transform",F.y2).call(fb);b=k.append("g").attr("clip-path",Ua).attr("class","grid");Uc&&b.append("g").attr("class","xgrids");Ob&&(c=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Ob).enter().append("g").attr("class","xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",g?"":"rotate(-90)").attr("dx",g? -0:-q).attr("dy",-6).text(function(a){return a.text}));Xd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",g?0:-10).attr("x2",g?n:-10).attr("y1",g?-10:q).attr("y2",g?-10:r);Vc&&b.append("g").attr("class","ygrids");Pb&&b.append("g").attr("class","ygrid-lines").selectAll("ygrid-line").data(Pb).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});k.append("g").attr("clip-path",Ua).attr("class","regions");k.append("g").attr("clip-path", -Ua).attr("class","chart");b=k.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",ta?"ew-resize":null);aa?Yd(b):Zd(b,a);k.select(".chart").append("g").attr("class","chart-bars");k.select(".chart").append("g").attr("class","chart-lines");k.select(".chart").append("g").attr("class","chart-arcs").attr("transform",F.arc);if(ta)k.insert("rect",$d?null:"g.grid").attr("class","zoom-rect").attr("width",n).attr("height",r).style("opacity",0).style("cursor","ew-resize").call(E).on("dblclick.zoom", -null);null!==rb&&K.extent("function"!==typeof rb?rb:rb(ga,qa));za&&(y.append("g").attr("clip-path",Ua).attr("class","chart"),y.select(".chart").append("g").attr("class","chart-bars"),y.select(".chart").append("g").attr("class","chart-lines"),y.append("g").attr("clip-path",Ua).attr("class","x brush").call(K).selectAll("rect").attr("height",oa),y.append("g").attr("class","x axis").attr("transform",F.subx).call(Ia));Ba&&sb(f.data.targets);Wc(f.data.targets);B({withTransition:!1,withUpdateXDomain:!0}); -if(ae){if(z&&"string"===typeof Ca){Ca=ra(Ca);for(a=0;aFb(c,a)?d.select(".event-rect").style("cursor","pointer"):d.select(".event-rect").style("cursor",null))}).on("click",function(){var a,c;A(f.data.targets)||(a=d.mouse(this),c=Bc(f.data.targets,a),100>Fb(c,a)&&k.select(".-circles-"+c.id).select(".-circle-"+c.index).each(function(){Yc(this, -c,c.index)}))}).call(d.behavior.drag().origin(Object).on("drag",function(){Zc(d.mouse(this))}).on("dragstart",function(){$c(d.mouse(this))}).on("dragend",function(){ad()})).call(E).on("dblclick.zoom",null)}function Yc(a,b,c){var e=d.select(a),f=e.classed(la),g=!1,k;"circle"===a.nodeName?(g=Lc(a,1.5*Sa),k=Oc):"rect"===a.nodeName&&(g=Mc(a),k=Qc);if(ua||g)ja&&ka(b)&&(e.classed(la,!f),k(!f,e,b,c)),ce(b,e)}function Zc(a){var b,c,e,g,m,v,l;A(f.data.targets)||!ja||ta&&!E.altDomain||(b=Tb[0],c=Tb[1],e=a[0], -a=a[1],g=Math.min(b,e),m=Math.max(b,e),v=ua?q:Math.min(c,a),l=ua?r:Math.max(c,a),k.select(".dragarea").attr("x",g).attr("y",v).attr("width",m-g).attr("height",l-v),k.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ka(a)}).each(function(a,b){var c=d.select(this),e=c.classed(la),h=c.classed(Ub),f,k,p,n;f=!1;"circle"===this.nodeName?(f=1*c.attr("cx"),k=1*c.attr("cy"),n=Oc,f=g",c,d,e;for(c=0;c"+e+""+d+"";return b+""}),ae=e(["tooltip","init","show"],!1),Ca=e(["tooltip","init","x"],0),Xc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Nb=ya.replace("#","")+"-clip",Ua="url(#"+Nb+")",z="timeseries"===gd,$="categorized"===gd,Eb=!z&&(sa||aa),Tb=null,Va=!1,Sb=!1,na=Ba?40:0,S=function(a,b){var c=[],d=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" "); -return function(b){if(b in a)return a[b];-1===c.indexOf(b)&&c.push(b);return d[c.indexOf(b)%d.length]}}(ie,je),pd=function(){var a=[[d.time.format("%Y/%-m/%-d"),function(){return!0}],[d.time.format("%-m/%-d"),function(a){return a.getMonth()}],[d.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[d.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[d.time.format("%I %p"),function(a){return a.getHours()}],[d.time.format("%I:%M"),function(a){return a.getMinutes()}],[d.time.format(":%S"), -function(a){return a.getSeconds()}],[d.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,d=a[c];!d[1](b);)d=a[--c];return d[0](b)}}(),$b,gc,bc,bb,fc,hc,n,r,oa,ub,xa,cb,xb,gb,lc,mc,Ab,jc,kc,yb,zb,m,x,Y,fa,db,eb,D,pa,fb,Ia,kd=g?"left":"bottom",ld=g?wb?"top":"bottom":wb?"right":"left",md=g?vb?"bottom":"top":vb?"left":"right",nd="bottom",F={main:function(){return"translate("+C+","+q+")"},context:function(){return"translate("+l+","+Da+")"},legend:function(){return"translate("+ -Zb+","+Yb+")"},y2:function(){return"translate("+(g?0:n)+","+(g?10:0)+")"},x:function(){return"translate(0,"+r+")"},subx:function(){return"translate(0,"+oa+")"},arc:function(){return"translate("+n/2+","+r/2+")"}};Ab=d.layout.pie().value(function(a){return a.values.reduce(function(a,c){return a+c.value},0)});var ee=function(){var a=d.svg.line().x(g?function(a){return H(a.id)(a.value)}:ob).y(g?ob:function(a){return H(a.id)(a.value)});return function(b){var c=Rc(b.values),d;if(Gb(b))return"spline"=== -N["string"===typeof b?b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),fd[b.id]?Od(c,m,H(b.id),fd[b.id]):a(c);d=m(c[0].x);b=H(b.id)(c[0].value);return g?"M "+b+" "+d:"M "+d+" "+b}}(),fe=function(){var a=d.svg.line().x(function(a){return fa(a.x)}).y(function(a){return W(a.id)(a.value)});return function(b){var c=Rc(b.values);return Gb(b)?a(c):"M "+fa(c[0].x)+" "+W(b.id)(c[0].value)}}(),K=d.svg.brush().on("brush",function(){B({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}), -E=d.behavior.zoom().on("zoomstart",function(){E.altDomain=d.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",ta?ge:null);K.update=function(){y&&y.select(".x.brush").call(this);return this};E.orgScaleExtent=function(){var a=ed?ed:[1,10];return[a[0],Math.max(Pa()/a[1],a[1])]};E.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(Z[1]-Z[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Ta,qb,k,y,Aa,R,pb,ga=null,qa=null,Z;f.focus=function(a){var b=d.selectAll(Ya(a)), -c=b.filter(Vb),b=b.filter(Wb);f.defocus();c.classed("focused",!0).transition().duration(100).style("opacity",1);b.transition().duration(100).style("opacity",1);A(f.data.targets)&&Ga(a,!0)};f.defocus=function(a){var b=d.selectAll(Ya(a)),c=b.filter(Vb),b=b.filter(Wb);c.classed("focused",!1).transition().duration(100).style("opacity",0.3);b.transition().duration(100).style("opacity",0.3);A(f.data.targets)&&Ha(a)};f.revert=function(a){var b=d.selectAll(Ya(a)),c=b.filter(Vb),b=b.filter(Wb);c.classed("focused", -!1).transition().duration(100).style("opacity",1);b.transition().duration(100).style("opacity",1);A(f.data.targets)&&Ha(a)};f.show=function(a){d.selectAll(Ya(a)).transition().style("opacity",1)};f.hide=function(a){d.selectAll(Ya(a)).transition().style("opacity",0)};f.unzoom=function(){K.clear().update();B({withUpdateXDomain:!0})};f.load=function(a){t(a.done)&&(a.done=function(){});"categories"in a&&$&&(Ja=a.categories,D.categories(Ja));if("cacheIds"in a&&zd(a.cacheIds))Wa(Ad(a.cacheIds),a.done);else if("data"in -a)Wa(Oa(a.data),a.done);else if("url"in a)d.csv(a.url,function(b,c){Wa(Oa(c),a.done)});else if("rows"in a)Wa(Oa(rc(a.rows)),a.done);else if("columns"in a)Wa(Oa(sc(a.columns)),a.done);else throw Error("url or rows or columns is required.");};f.unload=function(a){f.data.targets=f.data.targets.filter(function(b){return b.id!==a});d.selectAll(".target-"+a).transition().style("opacity",0).remove();Ba&&(d.selectAll(".legend-item-"+a).remove(),sb(f.data.targets));0b.classes.indexOf(a)})});return O};f.data.get=function(a){a=f.data.getAsTarget(a);return p(a)?a.values.map(function(a){return a.value}):void 0};f.data.getAsTarget=function(a){var b= -jb(function(b){return b.id===a});return 0a?0:a}function pc(a){return pa&&a===pa||aa&&Bd(aa,a)}function Cd(a){return!pc(a)}function kb(a){var b= +La[a.id];a.name=p(b)?b:a.id;return a}function qc(a){var b=a[0],c={},k=[],f,d;for(f=1;fu[c].indexOf(f.id)))for(d=0;db?a-b:0};return function(a){var d=b?X(a.id):I(a.id);return c(d(a.value))}}function Pa(a,b){var c=t(a)?lb():a;"string"=== +typeof c&&(c=[c]);for(var d=0;d=e;e+=s)g+=d(a[f-1],a[f],e,n)}return g}function Lb(a){var b,c;ob=d.select(va);if(ob.empty())U.alert('No bind element found. Check the selector specified by "bindto" and existance of that element. Default "bindto" is "#chart".');else{ob.html("");g.data.x={};g.data.targets=Ma(a);ta();Wb();m.domain(d.extent(ib(g.data.targets)));x.domain(gb("y"));Z.domain(gb("y2"));Q.domain(m.domain());bb.domain(x.domain());cb.domain(Z.domain());E.ticks(10>a.length?a.length:10);na.ticks(Pd).outerTickSize(0).tickFormat(Qd); +db.ticks(Rd).outerTickSize(0).tickFormat(Sd);R=m.domain();F.x(Q);qa&&B.x(m);Ra=d.select(va).append("svg").attr("width",r+D+ea).attr("height",q+s+J).on("mouseenter",Td).on("mouseleave",Ud);pb=Ra.append("defs");pb.append("clipPath").attr("id",Mb).append("rect").attr("y",s).attr("width",r).attr("height",q-s);pb.append("clipPath").attr("id","xaxis-clip").append("rect").attr("x",-1-D).attr("y",-20).attr("width",W).attr("height",V);pb.append("clipPath").attr("id","yaxis-clip").append("rect").attr("x",-D+ +1).attr("y",s-1).attr("width",ka).attr("height",sb);l=Ra.append("g").attr("transform",G.main);y=xa?Ra.append("g").attr("transform",G.context):null;ya=za?Ra.append("g").attr("transform",G.legend):null;S=d.select(va).style("position","relative").append("div").style("position","absolute").style("z-index","10").style("display","none");l.append("g").attr("class","x axis").attr("clip-path",h?"":"url(#xaxis-clip)").attr("transform",G.x).call(h?na:E).append("text").attr("class","-axis-x-label").attr("x", +r).attr("dy","-.5em").style("text-anchor","end").text(Vd);l.append("g").attr("class","y axis").attr("clip-path",h?"url(#yaxis-clip)":"").call(h?E:na).append("text").attr("transform","rotate(-90)").attr("dy","1.2em").attr("dx","-.5em").style("text-anchor","end").text(Wd);cc&&l.append("g").attr("class","y2 axis").attr("transform",G.y2).call(db);b=l.append("g").attr("clip-path",Sa).attr("class","grid");Tc&&b.append("g").attr("class","xgrids");Nb&&(c=b.append("g").attr("class","xgrid-lines").selectAll(".xgrid-line").data(Nb).enter().append("g").attr("class", +"xgrid-line"),c.append("line").attr("class",function(a){return""+a["class"]}),c.append("text").attr("class",function(a){return""+a["class"]}).attr("text-anchor","end").attr("transform",h?"":"rotate(-90)").attr("dx",h?0:-s).attr("dy",-6).text(function(a){return a.text}));Xd&&b.append("g").attr("class","xgrid-focus").append("line").attr("class","xgrid-focus").attr("x1",h?0:-10).attr("x2",h?r:-10).attr("y1",h?-10:s).attr("y2",h?-10:q);Uc&&b.append("g").attr("class","ygrids");Ob&&b.append("g").attr("class", +"ygrid-lines").selectAll("ygrid-line").data(Ob).enter().append("line").attr("class",function(a){return"ygrid-line "+a["class"]});l.append("g").attr("clip-path",Sa).attr("class","regions");l.append("g").attr("clip-path",Sa).attr("class","chart");b=l.select(".chart").append("g").attr("class","event-rects").style("fill-opacity",0).style("cursor",qa?"ew-resize":null);aa?Yd(b):Zd(b,a);l.select(".chart").append("g").attr("class","chart-bars");l.select(".chart").append("g").attr("class","chart-lines");l.select(".chart").append("g").attr("class", +"chart-arcs").attr("transform",G.arc);if(qa)l.insert("rect",$d?null:"g.grid").attr("class","zoom-rect").attr("width",r).attr("height",q).style("opacity",0).style("cursor","ew-resize").call(B).on("dblclick.zoom",null);null!==qb&&F.extent("function"!==typeof qb?qb:qb(ib()));xa&&(y.append("g").attr("clip-path",Sa).attr("class","chart"),y.select(".chart").append("g").attr("class","chart-bars"),y.select(".chart").append("g").attr("class","chart-lines"),y.append("g").attr("clip-path",Sa).attr("class","x brush").call(F).selectAll("rect").attr("height", +ma),y.append("g").attr("class","x axis").attr("transform",G.subx).call(Ga));za&&rb(g.data.targets);Vc(g.data.targets);C({withTransition:!1,withUpdateXDomain:!0});if(ae){if(z&&"string"===typeof Aa){Aa=oa(Aa);for(a=0;aEb(c,a)?d.select(".event-rect").style("cursor","pointer"):d.select(".event-rect").style("cursor",null))}).on("click", +function(){var a,c;A(g.data.targets)||(a=d.mouse(this),c=Ac(g.data.targets,a),100>Eb(c,a)&&l.select(".-circles-"+c.id).select(".-circle-"+c.index).each(function(){Xc(this,c,c.index)}))}).call(d.behavior.drag().origin(Object).on("drag",function(){Yc(d.mouse(this))}).on("dragstart",function(){Zc(d.mouse(this))}).on("dragend",function(){$c()})).call(B).on("dblclick.zoom",null)}function Xc(a,b,c){var e=d.select(a),f=e.classed(ja),g=!1,h;"circle"===a.nodeName?(g=Kc(a,1.5*Qa),h=Nc):"rect"===a.nodeName&& +(g=Lc(a),h=Pc);if(ra||g)ha&&ia(b)&&(e.classed(ja,!f),h(!f,e,b,c)),ce(b,e)}function Yc(a){var b,c,e,f,h,m,n;A(g.data.targets)||!ha||qa&&!B.altDomain||(b=Sb[0],c=Sb[1],e=a[0],a=a[1],f=Math.min(b,e),h=Math.max(b,e),m=ra?s:Math.min(c,a),n=ra?q:Math.max(c,a),l.select(".dragarea").attr("x",f).attr("y",m).attr("width",h-f).attr("height",n-m),l.selectAll(".-shapes").selectAll(".-shape").filter(function(a){return ia(a)}).each(function(a,b){var c=d.select(this),e=c.classed(ja),k=c.classed(Tb),g,l,p,q;g=!1; +"circle"===this.nodeName?(g=1*c.attr("cx"),l=1*c.attr("cy"),q=Nc,g=f",c,d,e;for(c=0;c"+e+""+d+"";return b+""}),ae=e(["tooltip","init","show"],!1),Aa=e(["tooltip","init","x"],0),Wc=e(["tooltip","init","position"],{top:"0px",left:"50px"}),Mb=va.replace("#","")+"-clip",Sa="url(#"+Mb+")",z="timeseries"===fd,$="categorized"===fd,Db=!z&&(pa||aa),Sb=null,Ta=!1,Rb=!1,la=za?40:0,T=function(a,b){var c=[],d=null!==b?b:"#1f77b4 #ff7f0e #2ca02c #d62728 #9467bd #8c564b #e377c2 #7f7f7f #bcbd22 #17becf".split(" ");return function(b){if(b in +a)return a[b];-1===c.indexOf(b)&&c.push(b);return d[c.indexOf(b)%d.length]}}(ie,je),od=function(){var a=[[d.time.format("%Y/%-m/%-d"),function(){return!0}],[d.time.format("%-m/%-d"),function(a){return a.getMonth()}],[d.time.format("%-m/%-d"),function(a){return 1!==a.getDate()}],[d.time.format("%-m/%-d"),function(a){return a.getDay()&&1!==a.getDate()}],[d.time.format("%I %p"),function(a){return a.getHours()}],[d.time.format("%I:%M"),function(a){return a.getMinutes()}],[d.time.format(":%S"),function(a){return a.getSeconds()}], +[d.time.format(".%L"),function(a){return a.getMilliseconds()}]];return function(b){for(var c=a.length-1,d=a[c];!d[1](b);)d=a[--c];return d[0](b)}}(),Zb,fc,ac,$a,ec,gc,r,q,ma,tb,ua,ab,wb,eb,kc,lc,zb,ic,jc,xb,yb,m,x,Z,Q,bb,cb,E,na,db,Ga,jd=h?"left":"bottom",kd=h?vb?"top":"bottom":vb?"right":"left",ld=h?ub?"bottom":"top":ub?"left":"right",md="bottom",G={main:function(){return"translate("+D+","+s+")"},context:function(){return"translate("+n+","+Ba+")"},legend:function(){return"translate("+Yb+","+Xb+")"}, +y2:function(){return"translate("+(h?0:r)+","+(h?10:0)+")"},x:function(){return"translate(0,"+q+")"},subx:function(){return"translate(0,"+ma+")"},arc:function(){return"translate("+r/2+","+q/2+")"}};zb=d.layout.pie().value(function(a){return a.values.reduce(function(a,c){return a+c.value},0)});var ee=function(){var a=d.svg.line().x(h?function(a){return I(a.id)(a.value)}:nb).y(h?nb:function(a){return I(a.id)(a.value)});return function(b){var c=Qc(b.values),d;if(Fb(b))return"spline"===M["string"===typeof b? +b:b.id]?a.interpolate("cardinal"):a.interpolate("linear"),ed[b.id]?Od(c,m,I(b.id),ed[b.id]):a(c);d=m(c[0].x);b=I(b.id)(c[0].value);return h?"M "+b+" "+d:"M "+d+" "+b}}(),fe=function(){var a=d.svg.line().x(function(a){return Q(a.x)}).y(function(a){return X(a.id)(a.value)});return function(b){var c=Qc(b.values);return Fb(b)?a(c):"M "+Q(c[0].x)+" "+X(b.id)(c[0].value)}}(),F=d.svg.brush().on("brush",function(){C({withTransition:!1,withY:!1,withSubchart:!1,withUpdateXDomain:!0})}),B=d.behavior.zoom().on("zoomstart", +function(){B.altDomain=d.event.sourceEvent.altKey?m.orgDomain():null}).on("zoom",qa?ge:null);F.update=function(){y&&y.select(".x.brush").call(this);return this};B.orgScaleExtent=function(){var a=dd?dd:[1,10];return[a[0],Math.max(Na()/a[1],a[1])]};B.updateScaleExtent=function(){var a=m.orgDomain(),a=(a[1]-a[0])/(R[1]-R[0]),b=this.orgScaleExtent();this.scaleExtent([b[0]*a,b[1]*a]);return this};var Ra,pb,l,y,ya,S,ob,R;g.focus=function(a){var b=d.selectAll(Wa(a)),c=b.filter(Ub),b=b.filter(Vb);g.defocus(); +c.classed("focused",!0).transition().duration(100).style("opacity",1);b.transition().duration(100).style("opacity",1);A(g.data.targets)&&Ea(a,!0)};g.defocus=function(a){var b=d.selectAll(Wa(a)),c=b.filter(Ub),b=b.filter(Vb);c.classed("focused",!1).transition().duration(100).style("opacity",0.3);b.transition().duration(100).style("opacity",0.3);A(g.data.targets)&&Fa(a)};g.revert=function(a){var b=d.selectAll(Wa(a)),c=b.filter(Ub),b=b.filter(Vb);c.classed("focused",!1).transition().duration(100).style("opacity", +1);b.transition().duration(100).style("opacity",1);A(g.data.targets)&&Fa(a)};g.show=function(a){d.selectAll(Wa(a)).transition().style("opacity",1)};g.hide=function(a){d.selectAll(Wa(a)).transition().style("opacity",0)};g.unzoom=function(){F.clear().update();C({withUpdateXDomain:!0})};g.load=function(a){t(a.done)&&(a.done=function(){});"categories"in a&&$&&(Ha=a.categories,E.categories(Ha));if("cacheIds"in a&&zd(a.cacheIds))Ua(Ad(a.cacheIds),a.done);else if("data"in a)Ua(Ma(a.data),a.done);else if("url"in +a)d.csv(a.url,function(b,c){Ua(Ma(c),a.done)});else if("rows"in a)Ua(Ma(qc(a.rows)),a.done);else if("columns"in a)Ua(Ma(rc(a.columns)),a.done);else throw Error("url or rows or columns is required.");};g.unload=function(a){g.data.targets=g.data.targets.filter(function(b){return b.id!==a});d.selectAll(".target-"+a).transition().style("opacity",0).remove();za&&(d.selectAll(".legend-item-"+a).remove(),rb(g.data.targets));0b.classes.indexOf(a)})});return N};g.data.get=function(a){a=g.data.getAsTarget(a);return p(a)?a.values.map(function(a){return a.value}):void 0};g.data.getAsTarget=function(a){var b= +hb(function(b){return b.id===a});return 0