<p> The short, easy directions on how to do the auto-graphs (from a page table) are ALL in the last 5 lines of THIS web page. It is virtually automatic: Table turned into charts.
<- This top section is where YOUR Table Description would go -> (The rest of the top part of this page is an example table you can use as a starting point for YOUR actual table.) </p>

<table id="thetable">  <!-- This starts the table; the id="thetable" is necessary for the auto-graphing to work -->
<caption>
2009 Individual Sales by Category</caption> <!-- Pick a caption -->
<thead> <!-- Begins table head -->
<tr> <!-- Begins first and only row in head -->
<td> <!-- First cell (TABLE DATA) (it is empty to allow for the fact that the top cell of the first column will be empty because this 1st column is the row-labels on the left). -->
&nbsp;</td> <!-- (Also note this first table data cell contains a &nbsp; -- just a Non-Breaking SPace, recommended for empty td's.) </td> ends the cell -->
<th>
food</th>  <!--These 2 lines are the first COLUMN HEADING (in the top row -- there are headings for each of the column of data) You will likely have 3-8 of these. -->
                  <!-- Add or subtract 2-line units like these as needed for your 3-8 column headings. (Note browsers ignore comments marked-up like these.) -->

<th>
auto</th> <!-- (Note there are a total of 5 more, in addition to the one above, for a total of 6 column headings.) -->
<th>
household</th>
<th>
furniture</th>
<th>
kitchen</th>
<th>
bath</th>
</tr> <!--This ends the row the TABLE HEADINGS (at the top) are in -->
</thead> <!--This is also, thus the end of the TABLE HEAD section of the table. -->
<tbody> <!-- Now the TABLE BODY BEGINS -->
<tr> <!--This signifies the beginning of a new TABLE ROW (second row; but the first row with left-side headings and data) -->
<th>
Mary</th>  <!--This is the first ROW HEADING -- this one for the first row of data -->
<td>
150</td>  <!--This 2-line group and the following FIVE 2-line groups are the first row of data -- data for Mary and corresponding to the COLUMN HEADINGS -->
<td>
160</td>
<td>
40</td>
<td>
120</td>
<td>
30</td>
<td>
70</td>
</tr> <!--This ends row two, the first TABLE ROW with left-side headings and cells of data -->
<tr> <!--This begins a new TABLE ROW .(Note there are a total of 3 more complete TABLE ROWS, in addition to the one above, for a total of 4 ROWS
         <!-- (with appropriate ROW HEADINGS -- at the beginning). You will likely have 3-6 row headings for your data and add or substract accordingly. -->

<th>
Tom</th> 
<td>
3</td>
<td>
40</td>
<td>
30</td>
<td>
45</td>
<td>
35</td>
<td>
49</td>
</tr>

<!-- (Browsers ignore white space, like extra blank lines, as well as COMMENT LINES, like this one beginning with the special start arrow, and ending with the end arrow) -->

<tr>
<th>
Brad</th>
<td>
10</td>
<td>
180</td>
<td>
10</td>
<td>
85</td>
<td>
25</td>
<td>
79</td>
</tr>


<tr>
<th>
Kate</th>
<td>
40</td>
<td>
80</td>
<td>
90</td>
<td>
25</td>
<td>
15</td>
<td>
119</td>
</tr>


</tbody>  <!-- End of the Table Body. -->
</table>  <!-- End of the Table-->


<p><iframe height="375" id="I1" name="I1" scrolling="yes" src="http://mynichecomputing.org/visualize/jquery_plugin/tryit4.html" style="margin-left: -13px" width="650">Your browser does not support inline frames or is currently configured not to display inline frames.</iframe></p>

 

THAT'S IT.  With Input Format (for the page) set to "Full HTML" and working in the "Switch to Plain Text Editor" mode (via link at the bottom of Body textarea):
 Just change the contents of the table (P.S. it may have more OR less rows and/or columns) AND make sure to have  id="thetable" in your top table tag AND Copy and
 Paste the exaxt <iframe> ... </iframe> you see above at the bottom THEN YOUR Table will turn into an editable table and 3 kinds of dynamic graphs automatically!
[NOTES: If a Pie Graph showing 'Contribution to Grand Total by Table Row Members' does not make sense, Use tryit5.html for the iframe's source (src) instead of tryit4.html .
It is best to translate scales to whole numbers for accurate depictions -- experiment for best display. Here is an IMAGE-view of what the sample table on this current page generates.]