title: Google charts "does not fit either the Control or Visualization specification"
body: <p>When trying to add a Dashboard control to a working Google Charts item, I get 
  ".. does not fit either the Control or Visualization specification" - relating to the line "<code>var dashboard = new ...</code>" towards the end.</p>
  
  <p>The code below will work standalone and reproduces the entire error:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script type="text/javascript" src="https://www.google.com/jsapi"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
        google.load('visualization', '1.0', {'packages':['annotatedtimeline', 'controls']});
  
        google.setOnLoadCallback(drawChart);
  
        function drawChart() {         
              var data = new google.visualization.DataTable();
              data.addColumn('date', 'timestamp');
  
              data.addColumn('number', 'Age Partnership');
              data.addColumn('number', 'Aviva');
              data.addColumn('number', 'Saga');
              data.addColumn('number', 'Global');
              data.addColumn('number', 'Bower');
              data.addColumn('number', 'Esmart');
              data.addColumn('number', 'key');
  
  
              data.addRows(3);
              data.setValue(0, 0, new Date(2011, 10, 25, 15, 21, 16, 0));data.setValue(0, 2, 1);data.setValue(0, 1, 2);data.setValue(0, 7, 3);data.setValue(0, 5, 4);data.setValue(0, 4, 5);data.setValue(0, 3, 8);data.setValue(0, 6, 10);data.setValue(1, 0, new Date(2011, 10, 26, 12, 7, 50, 0));data.setValue(1, 1, 1);data.setValue(1, 2, 2);data.setValue(1, 4, 3);data.setValue(1, 7, 4);data.setValue(1, 5, 5);data.setValue(1, 3, 7);data.setValue(1, 6, 8);data.setValue(2, 0, new Date(2011, 10, 26, 12, 15, 2, 0));data.setValue(2, 1, 1);data.setValue(2, 2, 2);data.setValue(2, 7, 3);data.setValue(2, 4, 4);data.setValue(2, 5, 5);data.setValue(2, 6, 7);data.setValue(2, 3, 8);
              var options = { 
                  width: 1100, 
                  height: 450, 
                  title: 'Keyword Performance - equity release',
                  hAxis: {title: 'Date/Time', showTextEvery: 24},
                  isStacked:"true",
                  dateFormat: 'HH:mm MMMM dd, yyyy'
  
              };
  
              var categoryPicker = new google.visualization.ControlWrapper({
                  'controlType': 'CategoryFilter',
                  'containerId': 'control1',
                  'options': {
                    'filterColumnLabel': 'Metric',
                    'ui': {
                      'allowTyping': false,
                      'allowMultiple': true,
                      'selectedValuesLayout': 'belowStacked'
                    }
                  },
                  // Define an initial state, i.e. a set of metrics to be initially selected.
                  'state': {'selectedValues': [1,2,3,4,5,6,7]}
              });
  
              var chart = new google.visualization.AnnotatedTimeLine(document.getElementById('chart_div0'));
              chart.draw(data, options);
  
              var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard_div')).bind(categoryPicker, drawChart).draw(data, options);
  
      }
  &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div id="dashboard_div"&gt; 
    &lt;!--Divs that will hold each control and chart--&gt;
    &lt;div id="control1"&gt;&lt;/div&gt;
    &lt;div id="chart_div0"  style="width: 1100px; height: 450px;"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>