$location not working in AngularJS using d3.js

Question

This is the first time I face the issue and can't figure out why.
I'm using d3 to create an icicle chart.
There is a click event that is firing and calling changePath(). I see the console log which means that I do have access to $location.path but when I try to set it nothing happens: not a new page, not an error page, nothing!

If I don't change paths via angular my router won't maintain scope which is what I'm looking for.
Any clues?

var parentCtrl = function($scope,$location){

$scope.makeBSC = function(){

        var changePath = function(el){
          console.log($location.path());
          $location.path(el)
        }
        var width = 405,
            height = 420,
            color = d3.scale.category20c();

        var vis = d3.select("#bscChart").append("svg")
            .attr("width", height)
            .attr("height", width);

        var partition = d3.layout.partition()
            .size([width, height])
            .value(function(d) { return d.size; });

        var json = data;


        vis.data([json]).selectAll("rect")
          .data(partition.nodes)
            .enter().append("rect")
              .attr("y", function(d) { return d.x; })
              .attr("x", function(d) { return d.y; })
              .attr("height", function(d) { return d.dx; })
              .attr("width", function(d) { return d.dy; })
              .attr("class",function(d){
                if(d.isSel) return "rectBlue"
                return "rectGray"
              }).on("click", function(d){
                changePath(d.goTo);
         });
     }
}

Answer 1

OCD will not let me leave this question 'open'. So, as groner pointed out... Hi, I think you'll find the answer to your question in this question: AngularJS $location not changing the path

Also, a little value-ad. Checkout these directives that wrap d3 http://www.fullscale.co/dangle/