diff --git a/index.html b/index.html
index e8c7295..7bb651a 100644
--- a/index.html
+++ b/index.html
@@ -63,6 +63,7 @@
     <script type="text/javascript" src="./js/ng-drag.js"></script>
     
     <script type="text/javascript" src="./js/filters/filters.js"></script>
+    <script type="text/javascript" src="./js/services/services.js"></script>
     <script type="text/javascript" src="./js/directives/directives.js"></script>
     <script type="text/javascript" src="./js/app.js"></script>
 </body>
diff --git a/js/app.js b/js/app.js
index b11cdc9..7c32ce5 100644
--- a/js/app.js
+++ b/js/app.js
@@ -1,4 +1,4 @@
-var app = angular.module("chart-builder",["ngDrag","chart-builder.filters","chart-builder.directives"]);
+var app = angular.module("chart-builder",["ngDrag","chart-builder.filters","chart-builder.directives","chart-builder.services"]);
 
 app.value("allData",{
     "values":{
diff --git a/js/directives/directives.js b/js/directives/directives.js
index 36eff02..3322551 100644
--- a/js/directives/directives.js
+++ b/js/directives/directives.js
@@ -2,7 +2,7 @@ var app = angular.module("chart-builder.directives",["chart-builder.filters"]);
 
 app.value("chartTypes",["column","bar","pie"]);
 
-app.directive("dynamicChart", function () {
+app.directive("dynamicChart", function (d3Tip) {
     var controller = function (chartTypes,$scope) {
         $scope.chartTypes = chartTypes;
         $scope.chartTypeChosen = $scope.chartTypes[0];
@@ -124,7 +124,7 @@ app.directive("dynamicChart", function () {
             .attr("shape-rendering","crispEdges")
             .text(yLabel);
 
-          var tip_points = d3.tip()
+          var tip_points = d3Tip.tip
             .attr('class', 'd3-tip')
             .html(function(d) { return d.y; });
 
@@ -207,7 +207,7 @@ app.directive("dynamicChart", function () {
             .attr("shape-rendering","crispEdges")
             .text(yLabel);
 
-          var tip_points = d3.tip()
+          var tip_points = d3Tip.tip
             .attr('class', 'd3-tip')
             .html(function(d) { return d.x; })
             .direction("e")
@@ -290,7 +290,7 @@ app.directive("dynamicChart", function () {
             .attr('text-anchor', 'middle')
             .text(""+yLabel+" vs. "+xLabel);
 
-            var tip_points = d3.tip()
+            var tip_points = d3Tip.tip
             .attr('class', 'd3-tip')
             .html(function(d) {return d.data.y; })
             .direction(function(d){
diff --git a/js/services/services.js b/js/services/services.js
new file mode 100644
index 0000000..dbd9d20
--- /dev/null
+++ b/js/services/services.js
@@ -0,0 +1,5 @@
+var app = angular.module("chart-builder.services",[]);
+
+app.service("d3Tip", function () {
+    this.tip = d3.tip();
+});
\ No newline at end of file
diff --git a/js/todo.md b/js/todo.md
index 88b434e..e2acdda 100644
--- a/js/todo.md
+++ b/js/todo.md
@@ -1,7 +1,11 @@
 Left to do
 ==========
 
-1. Make d3-tip a service
-2. Use better DnD logic and make it directive - better logic for draggable
 3. Move d3 and other src files to chart directive
-4. Fix pie label position logic
\ No newline at end of file
+2. Use better DnD logic and make it directive - better logic for draggable
+4. Fix pie label position logic
+5. Rename filters/services.js to actual thing name
+
+Done
+-----
+-- 1. Make d3-tip a service
\ No newline at end of file