Note that there are some explanatory texts on larger screens.

plurals
  1. POJavaScript InfoVis Toolkit Error loading JSON from external file using AJAX
    primarykey
    data
    text
    <p>I have the code snippet shown below in my application . What I am trying to accomplish is this: anytime a checkbox is clicked, the bar chart should be updated. </p> <p><strong>In my error console I'm getting:</strong></p> <p>"Error: TypeError: values is undefined Source file:hit.js Line: 11017. </p> <p>I tried assigning the JSON directly in the function (var json = ...) and it works as it should but I can't get it to work by loading the JSON from the file. What am I doing wrong?</p> <pre><code> $(':checkbox').click(function () { init(); function init() { var request = new XMLHttpRequest( ); request.open("GET", "GetGenes.php", false); request.send(null); var json = request.response; console.log(request.response); var barChart = new $jit.BarChart({ //id of the visualization container injectInto: 'infovis', //whether to add animations animate: true, //horizontal or vertical barcharts orientation: 'horizontal', //bars separation barsOffset: 0.5, //visualization offset Margin: { top: 5, left: 5, right: 5, bottom: 5 }, //labels offset position labelOffset:5, //bars style type:'stacked', //whether to show the aggregation of the values showAggregates:true, //whether to show the labels for the bars showLabels:true, //label styles Label: { type: 'HTML', //Native or HTML size: 9, family: 'Arial', color: 'black' }, //tooltip options Tips: { enable: true, onShow: function(tip, elem) { tip.innerHTML = "&lt;b&gt;" + elem.name + "&lt;/b&gt;: " + elem.value; } } }); barChart.loadJSON(json); } }) </code></pre> <p>genes.php contains:</p> <pre><code>echo "{'label': ['label 1', 'label 2', 'label 3', 'label 4'],'values': [{'label': 'date A','values': [20, 40, 15, 5]}, {'label': 'date B','values': [30, 10, 45, 10]}, {'label': 'date E','values': [38, 20, 35, 17]}, {'label': 'date F','values': [58, 10, 35, 32]}, {'label''date D','values': [55, 60, 34, 38]}, {'label': 'date C','values': [26, 40, 25, 40]}]};"; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload