diff --git a/dist/pie-chart.js b/dist/pie-chart.js index e3cb43b..6ce3951 100644 --- a/dist/pie-chart.js +++ b/dist/pie-chart.js @@ -25,6 +25,7 @@ function link($scope, element, attrs, ctrl) { var dim = $utils.getDefaultMargins(); var svg; + var promise; var updateDimensions = function(dimensions) { dimensions.width = element[0].parentElement.offsetWidth || 900; @@ -59,6 +60,33 @@ .updateLegend(svg, data, dimensions, options); }; + var redraw = function(){ + var redrawData = $utils.addDataForGauge($scope.data, $scope.options); + + $utils.clean(element[0]); + updateDimensions(dim); + svg = $utils.bootstrap(element[0], dim); + + $utils + .draw(svg) + .updatePaths(svg, redrawData, dim, $scope.options) + .addLegend(svg) + .updateLegend(svg, redrawData, dim, $scope.options); + + }; + + var resizeWindow = function(){ + if (promise) { + $timeout.cancel(promise); + } + + promise = $timeout(redraw, 1); + + return promise; + }; + + $window.addEventListener('resize', resizeWindow); + $scope.$watch('data', function(newValue, oldValue) { newValue = $utils.addDataForGauge(newValue, $scope.options); diff --git a/dist/pie-chart.min.js b/dist/pie-chart.min.js index 5ae352a..7eb756f 100644 --- a/dist/pie-chart.min.js +++ b/dist/pie-chart.min.js @@ -1,4 +1,4 @@ /*! pie-chart - v1.0.0 - 2015-08-12 * https://github.com/n3-charts/pie-chart * Copyright (c) 2015 n3-charts Licensed , */ -!function(){"use strict";function a(a,b,c){function d(b,c,d,e){var f,g=a.getDefaultMargins(),h=function(a){a.width=c[0].parentElement.offsetWidth||900,a.height=c[0].parentElement.offsetHeight||500},i=function(b,c){a.updatePaths(f,b,g,c).updateLegend(f,b,g,c)},j=function(b,d){a.clean(c[0]),h(g),k(b,d,g)},k=function(b,d,e){b&&d&&(d=a.sanitizeOptions(d),f=a.bootstrap(c[0],e),a.draw(f).updatePaths(f,b,e,d).addLegend(f).updateLegend(f,b,e,d))};b.$watch("data",function(c,d){c=a.addDataForGauge(c,b.options),f?i(c,b.options):j(c,b.options)},!0),b.$watch("options",function(c){var d=a.addDataForGauge(b.data,c);j(d,c)},!0)}var e={replace:!0,restrict:"E",scope:{data:"=",options:"="},template:"
",link:d};return e}angular.module("n3-pie-chart",["n3-pie-utils"]).directive("pieChart",a),a.$inject=["$utils","$timeout","$window"]}(),angular.module("n3-pie-utils",[]).factory("$utils",[function(){return{draw:function(a){return a.append("g").attr({id:"n3-pie-arcs"}),this},updatePaths:function(a,b,c,d){var e=this.getTools(c,d),f=function(a){var b=this.__current?this.__current:{startAngle:a.startAngle,endAngle:a.startAngle},c={startAngle:a.startAngle,endAngle:a.endAngle},d=d3.interpolate(b,c);return function(a){return e.arc(d(a))}},g=a.selectAll("#n3-pie-arcs").selectAll(".arc").data(e.pie(b),function(a){return a.data.label});return g.enter().append("path").attr({"class":"arc",id:function(a,b){return"arc_"+b}}).style({fill:function(a){return a.data.color},"fill-opacity":.8}),g.transition().duration(250).attrTween("d",f).each("end",function(a){this.__current={startAngle:a.startAngle,endAngle:a.endAngle}}),g.exit().remove(),this},getTools:function(a,b){var c=this.getRadius(a),d=Math.max(c-b.thickness,0),e=d3.svg.arc().outerRadius(c).innerRadius(d),f=d3.layout.pie().value(function(a){return a.value});return"gauge"===b.mode&&f.sort(null),{pie:f,arc:e}},addLegend:function(a){a.append("g").attr("id","n3-pie-legend");return this},updateLegend:function(a,b,c,d){return"gauge"===d.mode?this.updateGaugeLegend(a,b,c,d):this.updateRegularLegend(a,b,c,d),this},updateRegularLegend:function(a,b,c,d){var e=this.getRadius(c),f=e-d.thickness,g=b.length*f/10,h=d3.scale.linear().range([-g,g]).domain([0,b.length-1]).nice(),i=a.selectAll("#n3-pie-legend").selectAll(".legend-item").data(b,function(a){return a.label});i.enter().append("text").classed("legend-item",!0).on("mouseover",this.onMouseOver(a)).on("mouseout",this.onMouseOut(a)),i.text(this.getLegendLabelFunction(f)).attr({"text-anchor":"middle",transform:function(a,b){return"translate(0, "+h(b)+")"}}).style({"font-family":"monospace","font-size":Math.max(12,f/10)+"px",fill:function(a){return a.color},"fill-opacity":.8}),i.exit().remove()},updateGaugeLegend:function(a,b,c,d){var e=(this.getRadius(c)-d.thickness)/2;if(!(0>e)){var f=a.selectAll("#n3-pie-legend"),g=f.selectAll(".legend-title").data(b.filter(function(a){return!a.__isComplement}));g.enter().append("text").attr({"class":"legend-title","text-anchor":"middle",y:-e/4+"px"}).style({"font-size":Math.max(e/2,12)+"px",fill:function(a){return a.color},"fill-opacity":.8}),g.text(function(a){return a.label}),g.exit().remove();var h=f.selectAll(".legend-value").data(b.filter(function(a){return!a.__isComplement}));h.enter().append("text").attr({"class":"legend-value","text-anchor":"middle",y:e/1.5+"px"}).style({"font-size":e+"px",fill:function(a){return a.color},"fill-opacity":.8}),h.text(function(a){return a.value+(a.suffix||"")}),h.exit().remove()}},getLegendLabelFunction:function(a){var b=this;return function(c,d){return 40>a?"":100>a?c.label:b.getLegendLabel(c.label,c.value,20)}},onMouseOver:function(a){return function(b,c){var d=function(a){return a.transition().duration(50).style({opacity:function(a,b){return b===c?"1":"0.4"}})};d(a.selectAll(".legend-item")),d(a.selectAll(".arc"))}},onMouseOut:function(a){return function(b,c){var d=function(a){return a.transition().duration(50).style({opacity:1})};d(a.selectAll(".legend-item")),d(a.selectAll(".arc"))}},getLegendLabel:function(a,b,c){for(var d=[],e=0;c>e;e++)d.push(".");return a+=" ",b=" "+b,a.split("").forEach(function(a,b){d[b]=a}),b.split("").forEach(function(a,e){d[c-b.length+e]=a}),d.join("")},increase_brightness:function(a,b){a=a.replace(/^\s*#|\s*$/g,""),3==a.length&&(a=a.replace(/(.)/g,"$1$1"));var c=parseInt(a.substr(0,2),16),d=parseInt(a.substr(2,2),16),e=parseInt(a.substr(4,2),16);return"#"+(0|256+c+(256-c)*b/100).toString(16).substr(1)+(0|256+d+(256-d)*b/100).toString(16).substr(1)+(0|256+e+(256-e)*b/100).toString(16).substr(1)},addDataForGauge:function(a,b){if(!b||"gauge"!==b.mode||1!==a.length)return a;a=a.concat();var c="white";return a[0].hasOwnProperty("complementBrightness")?c=this.increase_brightness(a[0].color,a[0].complementBrightness):a[0].hasOwnProperty("colorComplement")&&(c=a[0].colorComplement),a.push({value:b.total-a[0].value,color:c,__isComplement:!0}),a},getDefaultMargins:function(){return{top:10,right:10,bottom:10,left:10}},clean:function(a){d3.select(a).select("svg").remove()},bootstrap:function(a,b){d3.select(a).classed("chart",!0);var c=b.width,d=b.height,e=d3.select(a).append("svg").attr("width",c).attr("height",d).append("g").attr("transform","translate("+.5*b.width+","+.5*b.height+")");return e},getRadius:function(a){var b=a;return.5*Math.min(b.width-b.left-b.right,b.height-b.top-b.bottom)},looksLikeSameSeries:function(a,b){if(a.length!==b.length)return!1;for(var c=0;c",link:d};return e}angular.module("n3-pie-chart",["n3-pie-utils"]).directive("pieChart",a),a.$inject=["$utils","$timeout","$window"]}(),angular.module("n3-pie-utils",[]).factory("$utils",[function(){return{draw:function(a){return a.append("g").attr({id:"n3-pie-arcs"}),this},updatePaths:function(a,b,c,d){var e=this.getTools(c,d),f=function(a){var b=this.__current?this.__current:{startAngle:a.startAngle,endAngle:a.startAngle},c={startAngle:a.startAngle,endAngle:a.endAngle},d=d3.interpolate(b,c);return function(a){return e.arc(d(a))}},g=a.selectAll("#n3-pie-arcs").selectAll(".arc").data(e.pie(b),function(a){return a.data.label});return g.enter().append("path").attr({"class":"arc",id:function(a,b){return"arc_"+b}}).style({fill:function(a){return a.data.color},"fill-opacity":.8}),g.transition().duration(250).attrTween("d",f).each("end",function(a){this.__current={startAngle:a.startAngle,endAngle:a.endAngle}}),g.exit().remove(),this},getTools:function(a,b){var c=this.getRadius(a),d=Math.max(c-b.thickness,0),e=d3.svg.arc().outerRadius(c).innerRadius(d),f=d3.layout.pie().value(function(a){return a.value});return"gauge"===b.mode&&f.sort(null),{pie:f,arc:e}},addLegend:function(a){a.append("g").attr("id","n3-pie-legend");return this},updateLegend:function(a,b,c,d){return"gauge"===d.mode?this.updateGaugeLegend(a,b,c,d):this.updateRegularLegend(a,b,c,d),this},updateRegularLegend:function(a,b,c,d){var e=this.getRadius(c),f=e-d.thickness,g=b.length*f/10,h=d3.scale.linear().range([-g,g]).domain([0,b.length-1]).nice(),i=a.selectAll("#n3-pie-legend").selectAll(".legend-item").data(b,function(a){return a.label});i.enter().append("text").classed("legend-item",!0).on("mouseover",this.onMouseOver(a)).on("mouseout",this.onMouseOut(a)),i.text(this.getLegendLabelFunction(f)).attr({"text-anchor":"middle",transform:function(a,b){return"translate(0, "+h(b)+")"}}).style({"font-family":"monospace","font-size":Math.max(12,f/10)+"px",fill:function(a){return a.color},"fill-opacity":.8}),i.exit().remove()},updateGaugeLegend:function(a,b,c,d){var e=(this.getRadius(c)-d.thickness)/2;if(!(0>e)){var f=a.selectAll("#n3-pie-legend"),g=f.selectAll(".legend-title").data(b.filter(function(a){return!a.__isComplement}));g.enter().append("text").attr({"class":"legend-title","text-anchor":"middle",y:-e/4+"px"}).style({"font-size":Math.max(e/2,12)+"px",fill:function(a){return a.color},"fill-opacity":.8}),g.text(function(a){return a.label}),g.exit().remove();var h=f.selectAll(".legend-value").data(b.filter(function(a){return!a.__isComplement}));h.enter().append("text").attr({"class":"legend-value","text-anchor":"middle",y:e/1.5+"px"}).style({"font-size":e+"px",fill:function(a){return a.color},"fill-opacity":.8}),h.text(function(a){return a.value+(a.suffix||"")}),h.exit().remove()}},getLegendLabelFunction:function(a){var b=this;return function(c,d){return 40>a?"":100>a?c.label:b.getLegendLabel(c.label,c.value,20)}},onMouseOver:function(a){return function(b,c){var d=function(a){return a.transition().duration(50).style({opacity:function(a,b){return b===c?"1":"0.4"}})};d(a.selectAll(".legend-item")),d(a.selectAll(".arc"))}},onMouseOut:function(a){return function(b,c){var d=function(a){return a.transition().duration(50).style({opacity:1})};d(a.selectAll(".legend-item")),d(a.selectAll(".arc"))}},getLegendLabel:function(a,b,c){for(var d=[],e=0;c>e;e++)d.push(".");return a+=" ",b=" "+b,a.split("").forEach(function(a,b){d[b]=a}),b.split("").forEach(function(a,e){d[c-b.length+e]=a}),d.join("")},increase_brightness:function(a,b){a=a.replace(/^\s*#|\s*$/g,""),3==a.length&&(a=a.replace(/(.)/g,"$1$1"));var c=parseInt(a.substr(0,2),16),d=parseInt(a.substr(2,2),16),e=parseInt(a.substr(4,2),16);return"#"+(0|256+c+(256-c)*b/100).toString(16).substr(1)+(0|256+d+(256-d)*b/100).toString(16).substr(1)+(0|256+e+(256-e)*b/100).toString(16).substr(1)},addDataForGauge:function(a,b){if(!b||"gauge"!==b.mode||1!==a.length)return a;a=a.concat();var c="white";return a[0].hasOwnProperty("complementBrightness")?c=this.increase_brightness(a[0].color,a[0].complementBrightness):a[0].hasOwnProperty("colorComplement")&&(c=a[0].colorComplement),a.push({value:b.total-a[0].value,color:c,__isComplement:!0}),a},getDefaultMargins:function(){return{top:10,right:10,bottom:10,left:10}},clean:function(a){d3.select(a).select("svg").remove()},bootstrap:function(a,b){d3.select(a).classed("chart",!0);var c=b.width,d=b.height,e=d3.select(a).append("svg").attr("width",c).attr("height",d).append("g").attr("transform","translate("+.5*b.width+","+.5*b.height+")");return e},getRadius:function(a){var b=a;return.5*Math.min(b.width-b.left-b.right,b.height-b.top-b.bottom)},looksLikeSameSeries:function(a,b){if(a.length!==b.length)return!1;for(var c=0;c