graphic-javascript-vector-dots.htm / htm
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Punch Chart</title> <script src="graphic-javascript-vector-raphael.js" type="text/javascript" charset="utf-8"></script> <script src="graphic-javascript-vector-jquery.js" type="text/javascript" charset="utf-8"></script> <script src="graphic-javascript-vector-dots.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript" charset="utf-8"> </script> <style type="text/css" media="screen"> body { background: #000; color: #fff; font: 100.1% Helvetica, Arial, sans-serif; line-height: 1.3; margin: 0; } #chart { color: #333; left: 50%; margin: -150px 0 0 -400px; position: absolute; top: 50%; width: 300px; width: 800px; } </style> </head> <body> <table id="for-chart"> <tfoot> <tr> <td> </td> <th>12am</th> <th>1</th> <th>2</th> <th>3</th> <th>4</th> <th>5</th> <th>6</th> <th>7</th> <th>8</th> <th>9</th> <th>10</th> <th>11</th> <th>12pm</th> <th>1</th> <th>2</th> <th>3</th> <th>4</th> <th>5</th> <th>6</th> <th>7</th> <th>8</th> <th>9</th> <th>10</th> <th>11</th> </tr> </tfoot> <tbody> <tr> <th scope="row">Mon</th> <td></td> <td></td> <td></td> <td></td> <td>23</td> <td></td> <td></td> <td></td> <td></td> <td>40</td> <td></td> <td>15</td> <td>10</td> <td></td> <td>17</td> <td></td> <td>14</td> <td>12</td> <td>20</td> <td>16</td> <td></td> <td></td> <td>5</td> <td>28</td> </tr> <tr> <th scope="row">Tue</th> <td>35</td> <td>11</td> <td></td> <td>2</td> <td>35</td> <td></td> <td>22</td> <td></td> <td></td> <td>4</td> <td>3</td> <td></td> <td>29</td> <td>5</td> <td>34</td> <td></td> <td></td> <td>26</td> <td></td> <td></td> <td></td> <td></td> <td>29</td> <td>8</td> </tr> <tr> <th scope="row">Wed</th> <td></td> <td>31</td> <td></td> <td>19</td> <td>35</td> <td></td> <td></td> <td></td> <td></td> <td>1</td> <td>20</td> <td></td> <td></td> <td>21</td> <td>7</td> <td>5</td> <td>17</td> <td>23</td> <td>9</td> <td></td> <td>6</td> <td></td> <td>38</td> <td>27</td> </tr> <tr> <th scope="row">Thu</th> <td>12</td> <td></td> <td></td> <td></td> <td>37</td> <td>23</td> <td>17</td> <td></td> <td>32</td> <td></td> <td></td> <td>7</td> <td></td> <td></td> <td>27</td> <td></td> <td></td> <td>18</td> <td></td> <td>1</td> <td></td> <td>39</td> <td>3</td> <td></td> </tr> <tr> <th scope="row">Fri</th> <td></td> <td></td> <td></td> <td></td> <td>17</td> <td>30</td> <td></td> <td>2</td> <td>27</td> <td>22</td> <td></td> <td></td> <td></td> <td></td> <td>40</td> <td>38</td> <td>8</td> <td></td> <td></td> <td>8</td> <td></td> <td>9</td> <td></td> <td>38</td> </tr> <tr> <th scope="row">Sat</th> <td></td> <td></td> <td>18</td> <td>15</td> <td>38</td> <td></td> <td></td> <td></td> <td>24</td> <td></td> <td>30</td> <td></td> <td>10</td> <td></td> <td></td> <td></td> <td>20</td> <td>30</td> <td></td> <td></td> <td>34</td> <td></td> <td></td> <td>30</td> </tr> <tr> <th scope="row">Sun</th> <td></td> <td>11</td> <td>30</td> <td></td> <td></td> <td>20</td> <td>3</td> <td></td> <td></td> <td></td> <td>26</td> <td>3</td> <td>28</td> <td>23</td> <td></td> <td></td> <td></td> <td>21</td> <td></td> <td></td> <td></td> <td>20</td> <td></td> <td></td> </tr> </tbody> </table> <div id="chart"></div> </body> </html>
(C) Æliens 20/2/2008
You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.