I try to implement pie chart with raphael library and jquery on angularjs web application. Is there any short way to do this?
In comments you have Fiddle with working code.
Thanks for answers.
Here is a conductive line :
myapp.directive('rafaelPie',
'$q',
function ($compile, $q) {
'use strict';
return {
restrict: 'A',
scope: {
values:"=values",
width:"@width",
height:"@height",
labels:"=labels"
},
link: function postLink(scope, element, attr, ctrl) {
/*Create first pie raphael*/
var pie = Raphael(element[0], scope.width, scope.height).pieChart(350, 350, 200, values, labels, "#fff");
/*Wath value */
scope.$watch(scope.values, function (newValue, oldValue) {
pie.updateyourvalue();
});
scope.$watch(scope.label, function (newValue, oldValue) {
pie.updateyourvalue();
});
}
};
}
In your angularview
<div id="holder" rafael-pie width="700" height="700" ></div>