asgallant - I am attempting to use your solution below.  I have created a 
table using the google visualization api as you did below, and then copied 
over the lines of jQuery code that set the column widths, changed the 
column name for the title var and the width for the width var.  However, 
the column widths do not change.  I have even copied your whole function 
into an html file and ran it.  The table is created, but the column widths 
do not change when I change the width var value.

What am I doing wrong?

below is the script code in the <head> :

  <script type='text/javascript' 
src='https://www.google.com/jsapi'></script>
        <script src='http://www.smartcare.net/scripts/jquery.js' 
type='text/javascript'></script>          
        <script type='text/javascript'>
            google.load('visualization', '1', 
{packages:['Gauge','corechart','table']});
            google.setOnLoadCallback(drawVisualization);
            
            function drawVisualization() {
                // Create and populate the data table.
                var data = new google.visualization.DataTable();
                data.addColumn('string', 'Name');
                data.addColumn('number', 'Height');
                data.addColumn('boolean', 'Smokes');
                data.addRows(3);
                data.setCell(0, 0, 'Tong Ning mu');
                data.setCell(1, 0, 'Huang Ang fa');
                data.setCell(2, 0, 'Teng nu');
                data.setCell(0, 1, 174);
                data.setCell(1, 1, 523);
                data.setCell(2, 1, 86);
                data.setCell(0, 2, true);
                data.setCell(1, 2, false);
                data.setCell(2, 2, true);

                // Create and draw the visualization.
                visualization = new 
google.visualization.Table(document.getElementById('table'));
                visualization.draw(data, null);

                // set the width of the column with the title "Name" to 
100px
                var title = "Name";
                var width = "500px";
                $('.google-visualization-table-th:contains(' + title + 
')').css('width', width);
           }

    
            
            





On Tuesday, July 19, 2011 11:22:42 AM UTC-6, asgallant wrote:
>
> The API doesn't support this, but you can hack around it using jQuery:
>
> function drawVisualization() {
>      // Create and populate the data table.
>      var data = new google.visualization.DataTable();
>      data.addColumn('string', 'Name');
>      data.addColumn('number', 'Height');
>      data.addColumn('boolean', 'Smokes');
>      data.addRows(3);
>      data.setCell(0, 0, 'Tong Ning mu');
>      data.setCell(1, 0, 'Huang Ang fa');
>      data.setCell(2, 0, 'Teng nu');
>      data.setCell(0, 1, 174);
>      data.setCell(1, 1, 523);
>      data.setCell(2, 1, 86);
>      data.setCell(0, 2, true);
>      data.setCell(1, 2, false);
>      data.setCell(2, 2, true);
>
>      // Create and draw the visualization.
>      visualization = new 
> google.visualization.Table(document.getElementById('table'));
>      visualization.draw(data, null);
>
>      // set the width of the column with the title "Name" to 100px
>      var title = "Name";
>      var width = "100px";
>      $('.google-visualization-table-th:contains(' + title + 
> ')').css('width', width);
> }
>
>

-- 
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?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.


Reply via email to