pie.values() is no longer supported error in nv.d3.js

[angularjs-nvd3-directives]

pie.values() is no longer supported error in nv.d3.js

[cmaurer]

let me take a look.

same issue on the example pieChart.html file.

[cmaurer]

Looks like they changed the pie.js code 9 days ago. See commit: novus/nvd3@2cf5b63#src/models/pie.js

The whole concept of specifying a pie.values() function is
not consistent with other charts. For all pie charts,
the developer needs to make sure to just pass in an array of key-value
pairs. Nothing more. The example of nvd3.org is not the proper way of
passing data into pie charts.

Removing pie.values() functionality and putting console error message.
Updated examples. For issue #98, #162, #106

So the code has gone from

var wrap = container.selectAll('.nv-wrap.nv-pie').data([getValues(data[0])]);

to

var wrap = container.selectAll('.nv-wrap.nv-pie').data(data);

here is one of their examples:

https://github.com/novus/nvd3/blob/2cf5b63c910d7c909d12da1428c20435aa2f1d8a/test/pieChartTest.html

So that is what has happened, not sure what to do about it. Let me try removing the call to values in the example and following their comments.

thanks for your feedback. any suggestion on how i could do a temporary fix for this ?

[cmaurer]

Yes, remove the get values line from the directive, then run grunt to build a new dist file. Also, the example needs to has two outside arrays, that needs to be only one.

[cmaurer]

Sorry for the late response. I have the day off, and I have twenty things going on at once.

[cmaurer]

Looks like line 832.

no pb. ok i see the line with "values". now i have to learn how to use grunt and build that dist file :-)

[cmaurer]

If everything is setup, you should just have to run 'grunt' from the command line. Same directory where the grunt file is.

ok thank you for your help. It worked fine. now the example file is working and there is no more error in the console. but… 

there is a new issue:
the datas are loaded correctly when there are retrieved directly from the controller, even when the dataset is one parameter inside an object and called like this : data="myJsonObject.dataset". However, the same datas loaded with $resource.query (which i use in the project) are not displayed in the graph. instead there is "No datas available" or nothing at all if the dataset is one parameter inside the object. any idea about this one ?

[cmaurer]

Can you show me your controller code?

the controller :

controller('IndicatorsCtrl', ['$scope', 'Indicators', function($scope, Indicators) {
        $scope.indicators = Indicators.query();
        $scope.xFunction = function(){
            return function(d) {
                return d.key;
            };
        }
        $scope.yFunction = function(){
                return function(d) {
                    return d.y;
            };
        }

    }])

and the corresponding service :

factory('Indicators', function($resource){
        return $resource('json/indicators.json');
    })

the template:

<div class="row-fluid" ng-repeat="indicator in indicators">
    <div class="span12">
        <nvd3-pie-chart data="indicator.datas" id="indicator.name" width="800" height="400" x="xFunction()" y="yFunction()"><svg></svg></nvd3-pie-chart>
        <p>datas: {{indicator.datas}}</p>
    </div>
</div>

and finally the json :

[
    {   "name": "the name 1", 
        "datas": [ { "key": "One",  "y": 5 }, { "key": "Two", "y": 2 }, { "key": "Three", "y": 9 }, { "key": "Four", "y": 7 }, { "key": "Five", "y": 4 }, { "key": "Six", "y": 3  }, { "key": "Seven", "y": 9 } ]
    }, 
    {   "name": "the other name", 
        "datas": [ {    "label": "field operations", "y": 10 }, {   "label": "other", "y": 30 }, {  "label": "HHI", "y": 15 } ]
    }   
]

i also tried with an object with a single dataset and no ng-repeat directive. there is the same issue: it doesn't work with $resource.query

[cmaurer]

ok. looking at it now.

[cmaurer]

ok, check this plnkr out
http://plnkr.co/edit/RqRfQZPSaptBj9Q2VsTO?p=preview

It is the 'singular' version

One issue you had was assigning the result of the query call to the scope variable. query() returns a promise, not the data. In the plnkr, I added a function to the query call so it would assign the data returned from the promise rather than the promise itself.

Also, nvd3 is pretty particular (at least in this version), about having the data array being called 'values'. After working with nvd3 for a while, it is a lot easier to transform your data to have it be named 'values', rather than trying to get it to work the other way around.

As for embedding charts with ng-repeat, I will need to tinker with that to get it working.

thank you very much ! i will try this in a couple of hours (i am in the rush now!)

I copied everything in my app, but it's not working. there is just a very minimal abstract composition with a small blue dot and a vertical white line on the screen. no error in the console, and it's possible to display the raw datas on the page with {{indicatorsData}}. it's working in plunker so it should work in my app. i will check this again after a nap. thanks for your help.

[cmaurer]

ok. Is there any way you can copy what you have into another plunker?

I am not sure i can make another plunker with my code, because i copied your code in my app, and i didn't change anything. i'll check this later today (still in the rush on a client project…)

btw, instead of using the callback method of $resource like you did, what do you think about $watch on the object which is binded to the directive ? (like so: http://stackoverflow.com/a/14635137/2112538)

[cmaurer]

The directive already uses $watch,

link: function(scope, element, attrs){
   scope.$watch('data', function(data){
      if(data){
nv.addGraph({

and the data scope is defined with a '=', which sets up 2-way data binding in angular.

What is being output to the console when you try to view the chart?

[cmaurer]

desgnl,
I didn't intend to close this issue. I know you still need some help getting this going, can you contact me directly and I can help you get up and running?

[bradyhigginbotham]

@cmaurer, you may want to reopen this bug as the basic pie chart example in the examples folder seems to be broken, very similar to @desgnl's issues above.

[cmaurer]

@stickwithchrist sounds like a plan.

[cmaurer]

Fixed in
671a40b

[hel123]

I am begineer for sugarcrm,i am not able to trace the error and followed all the steps which described above.can any one help me,still same error is coming in my console i.e,pie.values() is no longer supported used Asol reports