Populate Jqplot From Remote Json

I'm trying to populate a bar chart from an external JSON in a PHP file. I've trying to use AJAX and getJSON function to do this but still failed to generate a chart. Here is how my

Solution 1:

$(document).ready(function() {

    $.getJSON('data.php', function (data) {

        var tick = ['asd','fsdf','asda','fdsf'];

        var options = {
            legend: {
                show: true
            },
            title: 'Poll Results',
            seriesDefaults: {
                renderer: $.jqplot.BarRenderer,
                pointLabels: {
                    show: true,
                    location: 'e',
                    edgeTolerance: -15
                },
                shadowAngle: 135,
                renderOptions: {
                    barDirection: 'horizontal'
                }
            },
            axes: {
                xaxis: {
                    renderer: $.jqplot.CategoryAxisRenderer,
                    ticks: tick
                }
            }
        };
        var plot = $.jqplot('chart2', data[0].VALUES, options);
    });
});

Make sure to include these plugins

<scripttype="text/javascript"src="../src/plugins/jqplot.barRenderer.min.js"></script><scripttype="text/javascript"src="../src/plugins/jqplot.categoryAxisRenderer.min.js"></script><scripttype="text/javascript"src="../src/plugins/jqplot.pointLabels.min.js"></script>

This is my data.php

$arr = [
    "NAME" => "a chart",
    "VALUES" => [[439, 233, 233, 495],[292, 360, 262, 173],[222, 95, 27, 27]]
];

header('Content-Type: application/json');
print json_encode([$arr]);