View change does not remove Chart

26 views
Skip to first unread message

Carlos Martinez

unread,
Jan 8, 2016, 3:01:59 PM1/8/16
to d3-js
Using ui-router, angularjs and d3.js on Visual Studio 2015.

1. chart.cshtml :

<body>
    <div ng-app="ParetoChart">
             <div ng-controller="paretoChartController">
             </div>
    </div>
</body>

2. paretoChartController has the basic pareto chart code available in d3.js example.

3. Chart is displayed perfectly.

4. Curent (Chart) View is changed to another view through the angularjs ui-router.

5. The new view only contains text. The Chart stays below the text on the new view. Switching to other views keep the chart below what ever is displayed. Does not overlap the new view.

6. How do I clear the chart when exiting the Chart View ?

Emran Talukder

unread,
Jan 9, 2016, 2:28:27 PM1/9/16
to d3-js
Take a look at scope.$destroy

Pass a function to that to dispose your chart. Remove(*) and any events, ect..

Carlos Martinez

unread,
Jan 12, 2016, 1:06:15 PM1/12/16
to d3-js
Thanks. 
       $scope.$on("$destroy", function () {
            d3.selectAll("svg").remove();
        });

David Luu

unread,
Jan 30, 2016, 9:39:55 PM1/30/16
to d3-js
May I ask where "pareto chart code available in d3.js example" is from? I have not heard/found any pareto chart for d3, doing a brief search for it and looking at d3 examples gallery, other than this one: http://bl.ocks.org/curran/11301130.
Reply all
Reply to author
Forward
0 new messages