jquery - How to extract specific properties from each JSON object using javascript - Stack Overflow

admin管理员组

文章数量:1324038

I have a JSON dataset

[{"key":"Albania",
    "values":[{                                                                  
        "Country_Names":"Albania",
        "Total":"3.8",
        "Change_total":"-38.7",
        "Main activity electricity and heat production":"0.1",
        "Main activity electricity plants":"","Main activity CHP plants":"",
        "Unallocated autoproducers / Other energy industry own use":"0.1",
        "Other":"1.4",
        "Manufacturing industries and construction":"1",
        "Iron and steel":"0","Chemical and petrochemical":"0","Machinery":"",
        "Mining and quarrying":"",
        "Food and tobacco":"0.1",
        "Paper, pulp and printing":"",
        "Construction":"0",
        "Transport":"2.2",
        "Road":"2.2",
        "Domestic aviation":"",
        "Rail":"0",
        "Domestic navigation":"0.1",
        "Residential":"0.2",
        "Commercial and public services":"0",
        "Agriculture/forestry":"0.2",
        "Sub-bituminous coal / Lignite":"",
        "Other bituminous coal":"",
        "Natural gas":"0",
        "Motor gasoline excl. bio":"0.3",
        "Gas/diesel oil excl. bio":"2.2"
    }]
}]

I want to extract specific values (Road, Rail for example) from each key (country) and draw an individual pie chart form each object. For example one chart for Albania that shows Road and Rail value and then same chart fro the next country in the data set.

I am trying to achieve this with the following code:

function checkIt(data) {
    var countriesByName = d3.nest()
    .key(function(d) { return d.Country_Names; })
    .entries(data);
    //console.log(countriesByName)
    var data = JSON.stringify(countriesByName);
    console.log(data);
    function makePie() {
        function myfunc(data){
            var obj =  [];
            for (var i in data.key) {
                obj.push('Road' + m.countriesByName[i].key.values[i].Food+ ' and tobacco');
            }
        }
        var data1 =  myfunc(data);
        //console.log(data)
        var chart = c3.generate({
            bindto: "#left",
            data: {
                columns: [
                data1
                ],type : "donut" 
            }
        });
    }
    makePie();
};
d3.json(".json", checkIt);

and I get the following error:

Uncaught TypeError: Cannot read property '0' of undefined

here is the JS fiddle for the dataset:

The expected result is something like this ["Road", 2.2] I then want to run it as loop for all countries inside the data to get similar arrays

I have a JSON dataset

[{"key":"Albania",
    "values":[{                                                                  
        "Country_Names":"Albania",
        "Total":"3.8",
        "Change_total":"-38.7",
        "Main activity electricity and heat production":"0.1",
        "Main activity electricity plants":"","Main activity CHP plants":"",
        "Unallocated autoproducers / Other energy industry own use":"0.1",
        "Other":"1.4",
        "Manufacturing industries and construction":"1",
        "Iron and steel":"0","Chemical and petrochemical":"0","Machinery":"",
        "Mining and quarrying":"",
        "Food and tobacco":"0.1",
        "Paper, pulp and printing":"",
        "Construction":"0",
        "Transport":"2.2",
        "Road":"2.2",
        "Domestic aviation":"",
        "Rail":"0",
        "Domestic navigation":"0.1",
        "Residential":"0.2",
        "Commercial and public services":"0",
        "Agriculture/forestry":"0.2",
        "Sub-bituminous coal / Lignite":"",
        "Other bituminous coal":"",
        "Natural gas":"0",
        "Motor gasoline excl. bio":"0.3",
        "Gas/diesel oil excl. bio":"2.2"
    }]
}]

I want to extract specific values (Road, Rail for example) from each key (country) and draw an individual pie chart form each object. For example one chart for Albania that shows Road and Rail value and then same chart fro the next country in the data set.

I am trying to achieve this with the following code:

function checkIt(data) {
    var countriesByName = d3.nest()
    .key(function(d) { return d.Country_Names; })
    .entries(data);
    //console.log(countriesByName)
    var data = JSON.stringify(countriesByName);
    console.log(data);
    function makePie() {
        function myfunc(data){
            var obj =  [];
            for (var i in data.key) {
                obj.push('Road' + m.countriesByName[i].key.values[i].Food+ ' and tobacco');
            }
        }
        var data1 =  myfunc(data);
        //console.log(data)
        var chart = c3.generate({
            bindto: "#left",
            data: {
                columns: [
                data1
                ],type : "donut" 
            }
        });
    }
    makePie();
};
d3.json("https://gist.githubusercontent./heenaI/cbbc5c5f49994f174376/raw/82cd19eff7db367193cf8ce00144a40ea8d140ac/data.json", checkIt);

and I get the following error:

Uncaught TypeError: Cannot read property '0' of undefined

here is the JS fiddle for the dataset:

The expected result is something like this ["Road", 2.2] I then want to run it as loop for all countries inside the data to get similar arrays

• javascript
• jquery
• arrays
• json

Share Follow edited Nov 17, 2015 at 13:27 Imo asked Nov 17, 2015 at 12:15 ImoImo 1,47544 gold badges3030 silver badges5757 bronze badges 10

• array.map would be your friend for actually modifying your array into the final result. And array.reduce for turning your values array into something. For example summing all the rail values. – ste2425 Commented Nov 17, 2015 at 12:21
• What kind of data object does your chart plugin expect... ??? ,, You are supposed to construct json that your chart is expecting and send it as argument – Nischal Kumar BC Commented Nov 17, 2015 at 12:22
• jsfiddle/n5v84svm/32 => undefined ; data.key don't work like you expect I think... – Blag Commented Nov 17, 2015 at 12:30
• looking into the code and the error further, It seems to be expecting a 2D array where you have columns in the data object. – Sean_A91 Commented Nov 17, 2015 at 12:34
• I've been fiddling with it and, columns: [[data1]], making it into a 2D array DOES get rid of the error, now the question is what is it supposed to look like? what kind of data? Is the fiddle all of your code? – Sean_A91 Commented Nov 17, 2015 at 12:42

 |  Show 5 more ments

1 Answer 1

Sorted by: Reset to default 5

You have forgotten parse your json string to JSONObject, for this reason you can't access to key property from string.

Under var data = JSON.stringify(countriesByName); you have to parse your object like this:

var data = JSON.parse(data);

Once you have done this, you can acces to your JSONObject properties.

Check this Demo.

本文标签： jqueryHow to extract specific properties from each JSON object using javascriptStack Overflow