Trouble parsing XML into JSON - Javascript

Question

I am trying to parse some XML data into JSON using Javascript/Jquery for use in a Highcharts project. Unfortunately, I can't figure out what is wrong with my code as it will not even read the XML. So far I have:

xml:

<Row>
    <Category>data</Category>
    <actual>data</actual>
</row>
....

HTML:

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>Document</title>
</head>
<body>
    <h1>Hello</h1>
    <div id="container" style="height: 400px; width: 500px"></div>

<script type = "text/javascript" src = "jquery-1.11.1.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script type = "text/javascript" src = "test.js"></script>
</body>
</html>

Javascript:

$(document).ready(function(){

var globalData = new Array();

// $("h1").click(function(){
    // Load the data from the XML file 
    $.get('C:\\Users\\xxxxxx\\Desktop\\xmloutput.xml', function(xml) {
        alert("it works");

        // Split the lines
        var $xml = $(xml);

        // push series
        $xml.find('Row').each(function(i, row) {
            var seriesOptions = {
                Category: $(series).find('Category').text(),
                Actual: $(series).find('Actual').text(),
            };

            // add it to the options
            globalData.push(seriesOptions);
        });


    });
// });


$(function() {
    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'pie'
        },

        plotOptions: {
            pie: {
                borderColor: '#000000',
                innerSize: '60%'
            }
        },
        series: [{
            data: globalData
        }]
    },
    // using 

    function(chart) { // on complete

        var xpos = '50%';
        var ypos = '53%';
        var circleradius = 102;

    // Render the circle
    chart.renderer.circle(xpos, ypos, circleradius).attr({
        fill: '#ddd',
    }).add();

    // Render the text 
    chart.renderer.text('THIS TEXT <span style="color: red">should be in the center of the donut</span>', 155, 215).css({
            width: circleradius*2,
            color: '#4572A7',
            fontSize: '16px',
            textAlign: 'center'
      }).attr({
            // why doesn't zIndex get the text in front of the chart?
            zIndex: 999
        }).add();
    });
});


});

I believe my actual problem may be that my xml-parsing syntax is incorrect but running this on the development console in Firefox reveals no errors. Hopefully the experts here can spot the issue(s)

Thanks for your time.

You need to use webserver to load files by $.get() function. — Sebastian Bochan
– Sebastian Bochan, Commented Jul 2, 2014 at 10:08

Matas Vaitkevicius · Accepted Answer · 2014-07-01 16:33:55Z

2

One imediate problem that I can see is using local path

$.get('C:\\Users\\xxxxxx\\Desktop\\xmloutput.xml',

$.get first parameter is url that is location on network it could be something like $.get('http://localhost/xmls/xmloutput.xml,...

answered Jul 1, 2014 at 16:33

Matas Vaitkevicius

61.9k37 gold badges253 silver badges278 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

YazanLpizra Over a year ago

Does not fix the problem, as I cannot see anything new happen. Probably means I have more issues with the code :(

Matas Vaitkevicius Over a year ago

you can read xml from path that is within your web application, put xml you want to read into the folder where that code for website is and then http://localhost[port that you are using]/xmloutput.xml. Website cannot see C: only things that are inside it's folder.

YazanLpizra Over a year ago

Is there a default port that I would be unknowingly using? This website is just a prototype as of now and is not hosted yet

Matas Vaitkevicius Over a year ago

default port is 80 but if there is no port when you are accessing your website then just use http://localhost

Collectives™ on Stack Overflow

Trouble parsing XML into JSON - Javascript

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related