I suspect that it is possible to accomplish what you want, but that doing
so might be prohibitively complicated. Off the top of my head, I think
that the basic structure you would need follows this outline:
1. create a DataTable with the first and last rows being empty of all
values except the "goal"
2. create ControlWrapper(s) for filters, ChartWrapper for chart, and a
dummy chart
3. create "ready" event listener for the dummy that:
1. get the dummy's data
2. add in the first and last rows from the DataTable (the empty rows
from above with the goal values)
3. build the chart's hAxis options to fit the data set
4. draw the chart with the new data setdata
4. bind the ControlWrapper(s) to the dummy chart in a Dashboard
5. draw the Dashboard
I wrote up a skeleton framework for this, but couldn't test it since your
spreadsheet isn't published. The code makes a lot of assumptions that
might not necessarily be true in your case. See it here:
http://jsfiddle.net/asgallant/h6nks/
As an aside, this line:
seriesType: "Bars"
should be:
seriesType: "bars"
On Tuesday, May 13, 2014 9:34:18 AM UTC-4, RosaL wrote:
>
> I've made a simple dashboard which pulls from the following spreadsheet:
> https://docs.google.com/a/google.com/spreadsheets/d/1HLEVLFjr9eMQE2fSANiHDHc-qqSf4hjuDwlonQncdiQ/edit#gid=0
>
> Because the goal is the same for everyone and is static, I'd like to just
> chart a line across my columns that represents the goal value. Any ideas? I
> was able to chart a line for the goal value when making the chart
> originally, but when I added the dashboard components it didn't seem to
> work anymore. I also realized that charting a value for each individual
> isn't really what I want - if you filter to a single person, for example,
> you then see a single dot representing the goal. I'd rather keep it as a
> static line....
>
> Here's my code for the simple dashboard. Thanks!
>
> <html>
> <head>
> <script type="text/javascript" src="https://www.google.com/jsapi
> "></script>
> <script type="text/javascript">
> function drawVisualization () {
> var query = new google.visualization.Query('
> https://docs.google.com/a/google.com/spreadsheets/d/1HLEVLFjr9eMQE2fSANiHDHc-qqSf4hjuDwlonQncdiQ/edit#gid=0',
>
> 'A:D');
>
> query.send(function (response) {
> if (response.isError()) {
> alert('Error in query: ' + response.getMessage() + ' ' +
> response.getDetailedMessage());
> return;
> }
> var data = response.getDataTable();
>
> // create a Category control
> var filter = new google.visualization.ControlWrapper({
> controlType: 'CategoryFilter',
> containerId: 'control_div',
> options: {
> filterColumnIndex: 2
> }
> });
>
> // create a Table visualization
> var table = new google.visualization.ChartWrapper({
> chartType: 'ComboChart',
> containerId: 'table_div',
> options: {
> height: 380,
> width: 550,
> 'title': 'How do you stack up?',
> seriesType: "Bars", //this piece of code isn't working at
> the moment
> },
> view: {columns:[0,1,4]}
> });
>
> // Create the dashboard.
> var dashboard = new
> google.visualization.Dashboard(document.getElementById('dashboard')).
> // Configure the string filter to affect the table contents
> bind([filter], [table]).
> // Draw the dashboard
> draw(data);
> });
> }
>
> google.load('visualization', '1', {'packages':['controls']});
> google.setOnLoadCallback(drawVisualization);
> </script>
> </head>
>
> <body>
> <div id="dashboard">
> <div id="control_div"></div>
> <div id="table_div"></div>
> </div>
> </body>
> </html>
>
>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.
