0

I have a javascript file that imports Google Visualization to draw a line graph:

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">


    var inputData =  [[1990,157894],[1991,173725],[1992,181227],[1993,183315]];

      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {        
      var data = new google.visualization.DataTable();
            data.addColumn('number', 'Year');
            data.addColumn('number', 'January');
            data.addRows(inputData);


        var options = {
          title: 'Unemployed Statistics'
        };

        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>

After

<?php

if (isset($_POST['submitted'])) {

I have an element that draws the graph:

<div id="chart_div" style="width: 900px; height: 500px;"></div>

This works fine and the graph is drawn fine with this. However, when I put my json variable into var inputData, no graph is drawn. It would look like this:

var inputData = <?php echo json_encode($json['unemployment'), JSON_NUMERIC_CHECK) ?>; 

Why is nothing being drawn?

I run a print statement after I submit my form to check and see what <?php echo json_encode($json['unemployment') ?> is. Here is the output: [[1990,131337],[1991,160256],[1992,188129]] .

This output looks like it should easily work with the var inputData variable in my javascript code. However, nothing gets drawn. Am I doing something wrong?

user2562125
  • 179
  • 1
  • 2
  • 10
  • don't check the php output. do a "view source" in your browser to see if those numbers actually showed up in the generated page. – Marc B Oct 15 '13 at 21:43
  • Yes, they are showing up in view source. – user2562125 Oct 15 '13 at 21:45
  • are you missing a ]? json_encode($json['unemployment']) Or should the ) be a ]? json_encode($json['unemployment'], – Diver Oct 15 '13 at 21:48
  • var inputData = ; ... This is what I currently have. My bad. – user2562125 Oct 15 '13 at 21:53
  • manually put in the generated data. [[1990,286601],[1991,319983],[1992,362421],[1993,342919]] Make sure that the data set is valid and if so that the line isn't just being generated outside of the view area. – Diver Oct 15 '13 at 22:01

1 Answers1

2

look here: you have syntax error

<?php echo json_encode($json['unemployment'), JSON_NUMERIC_CHECK) 

$json['unemployment')
Dvir
  • 3,287
  • 1
  • 21
  • 33
  • var inputData = ; I changed it. Still nothing is happening. There is a space where it looks the the image should be drawn, but nothing is there. – user2562125 Oct 15 '13 at 21:52
  • The array now is ok on the js source? – Dvir Oct 15 '13 at 21:53
  • Yes i understand that but is the array ok? look at the source. and what happend if you write it hard-coded. is the graph work then? – Dvir Oct 15 '13 at 21:55
  • This is what appears on the page source after I push submit on the form.... [[1990,286601],[1991,319983],[1992,362421],[1993,342919]] – user2562125 Oct 15 '13 at 21:56
  • If I manually put random numbers into var inputData such as [[1990,286601],[1991,319983],[1992,362421],[1993,342919]] then my graph works fine. But I need them to be gathered from user selections by using json. – user2562125 Oct 15 '13 at 21:58
  • Actually I messed up. I was still looking at my echo statement. When I took that out and looked at the page source, var inputData = null. So it isn't getting transfered to my javascript. Any idea why that is? – user2562125 Oct 15 '13 at 22:02
  • so unemployment is null for some reason. can you show your php code? – Dvir Oct 15 '13 at 22:03
  • let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/39308/discussion-between-user2562125-and-dvir) – user2562125 Oct 15 '13 at 22:06