PiPlanter | Graphing timed mysql data with pchart

<p>Time to get this data we’re harvesting graphed. In a couple past posts, I’ve used pChart to graph random data but now since data is getting dumped into a mysql chart, it would make sense to try and graph that data.</p> <p>First, get the php5-gd package by running:</p> <div id="crayon-5706bac752006389554019" class="crayon-syntax crayon-theme-orange-code crayon-font-courier-new crayon-os-pc print-yes notranslate" data-settings=" minimize scroll-mouseover"> <div class="crayon-toolbar" data-settings=" show"> <div class="crayon-tools"><span class="crayon-language">Shell</span></div> </div> <div class="crayon-plain-wrap"></div> <div class="crayon-main"> <table class="crayon-table"> <tbody> <tr class="crayon-row"> <td class="crayon-nums" data-settings="show"> <div class="crayon-nums-content"> <div class="crayon-num" data-line="crayon-5706bac752006389554019-1">1</div> </div> </td> <td class="crayon-code"> <div class="crayon-pre"> <div id="crayon-5706bac752006389554019-1" class="crayon-line"><span class="crayon-e">sudo</span> <span class="crayon-v">apt</span><span class="crayon-o">–</span><span class="crayon-r">get</span> <span class="crayon-e">install</span> <span class="crayon-v">php5</span><span class="crayon-o">–</span><span class="crayon-v">gd</span></div> </div> </td> </tr> </tbody> </table> </div> </div> <p>Then download, rename and move the pChart files to the proper directory:</p> <div id="crayon-5706bac752011885372437" class="crayon-syntax crayon-theme-orange-code crayon-font-courier-new crayon-os-pc print-yes notranslate" data-settings=" minimize scroll-mouseover"> <div class="crayon-toolbar" data-settings=" show"> <div class="crayon-tools"><span class="crayon-language">Shell</span></div> </div> <div class="crayon-plain-wrap"></div> <div class="crayon-main"> <table class="crayon-table"> <tbody> <tr class="crayon-row"> <td class="crayon-nums" data-settings="show"> <div class="crayon-nums-content"> <div class="crayon-num" data-line="crayon-5706bac752011885372437-1">1</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752011885372437-2">2</div> <div class="crayon-num" data-line="crayon-5706bac752011885372437-3">3</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752011885372437-4">4</div> </div> </td> <td class="crayon-code"> <div class="crayon-pre"> <div id="crayon-5706bac752011885372437-1" class="crayon-line"><span class="crayon-e">sudo</span> <span class="crayon-r">mkdir</span> <span class="crayon-o">/</span><span class="crayon-v">srv</span><span class="crayon-o">/</span><span class="crayon-v">www</span><span class="crayon-o">/</span><span class="crayon-v">lib</span><span class="crayon-o">/</span></div> <div id="crayon-5706bac752011885372437-2" class="crayon-line crayon-striped-line"><span class="crayon-e">sudo</span> <span class="crayon-e">wget</span> <span class="crayon-v">http</span><span class="crayon-o">:</span><span class="crayon-o">/</span><span class="crayon-o">/</span><span class="crayon-v">www</span><span class="crayon-e">.pchart</span><span class="crayon-e">.net</span><span class="crayon-o">/</span><span class="crayon-v">release</span><span class="crayon-o">/</span><span class="crayon-v">pChart2</span><span class="crayon-sy">.</span><span class="crayon-cn">1.3.tar.gz</span></div> <div id="crayon-5706bac752011885372437-3" class="crayon-line"><span class="crayon-e">sudo</span> <span class="crayon-v">tar</span> <span class="crayon-o">–</span><span class="crayon-e">xzvf</span> <span class="crayon-v">pChart2</span><span class="crayon-sy">.</span><span class="crayon-cn">1.3.tar.gz</span></div> <div id="crayon-5706bac752011885372437-4" class="crayon-line crayon-striped-line"><span class="crayon-e">sudo</span> <span class="crayon-r">mv</span> <span class="crayon-v">pChart2</span><span class="crayon-sy">.</span><span class="crayon-cn">1.3</span> <span class="crayon-v">pChart</span></div> </div> </td> </tr> </tbody> </table> </div> </div> <p>Now pChart is ready to be used.</p> <p>I used a lot of the info found here:</p> <div class="ezAdsense adsense adsense-midtext" style="text-align:center;margin:12px;"><script async="" src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" type="text/javascript"> </script> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-2979805726071943" data-ad-slot="7471922310" data-ad-format="auto"></ins> <script type="text/javascript"> //<![CDATA[ (adsbygoogle = window.adsbygoogle || []).push({}); //]]> </script></div> <p><a href="http://ift.tt/20bJuL6" target="_blank">http://ift.tt/20bJuL6</a></p> <p><a href="http://ift.tt/1WfKNZw" target="_blank">http://ift.tt/1WfKNZw</a></p> <p>The code is pretty well commented so I’m not really going to get into describing it, but essentially, the following php will retrieve data from a mysql table (which is being populated by a <a href="http://ift.tt/25HSsUs" itemprop="url" target="_bank" title="Controlling DC Motors Using Python With a Raspberry Pi"><strong>python</strong></a> script seen in <a href="http://ift.tt/20bJuL8" target="_blank">this</a> post) and after leaving it on in my room for like 3 days, render this graph:</p> <p><a href="http://ift.tt/1WfKOfL" target="_blank"><img alt="" class="aligncenter wp-image-580" height="180" src="http://ift.tt/1WfKOfL" width="660" /></a></p> <p>Here’s that php script:</p> <div id="crayon-5706bac752017554634927" class="crayon-syntax crayon-theme-orange-code crayon-font-courier-new crayon-os-pc print-yes notranslate" data-settings=" minimize scroll-mouseover"> <div class="crayon-toolbar" data-settings=" show"> <div class="crayon-tools"> <div class="crayon-button crayon-popup-button" title="Open Code In New Window"></div> <p><span class="crayon-language">PHP</span></p> </div> </div> <div class="crayon-plain-wrap"></div> <div class="crayon-main"> <table class="crayon-table"> <tbody> <tr class="crayon-row"> <td class="crayon-nums" data-settings="show"> <div class="crayon-nums-content"> <div class="crayon-num" data-line="crayon-5706bac752017554634927-1">1</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-2">2</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-3">3</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-4">4</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-5">5</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-6">6</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-7">7</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-8">8</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-9">9</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-10">10</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-11">11</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-12">12</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-13">13</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-14">14</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-15">15</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-16">16</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-17">17</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-18">18</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-19">19</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-20">20</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-21">21</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-22">22</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-23">23</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-24">24</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-25">25</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-26">26</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-27">27</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-28">28</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-29">29</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-30">30</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-31">31</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-32">32</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-33">33</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-34">34</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-35">35</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-36">36</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-37">37</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-38">38</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-39">39</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-40">40</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-41">41</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-42">42</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-43">43</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-44">44</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-45">45</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-46">46</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-47">47</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-48">48</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-49">49</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-50">50</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-51">51</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-52">52</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-53">53</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-54">54</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-55">55</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-56">56</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-57">57</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-58">58</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-59">59</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-60">60</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-61">61</div> <div class="crayon-num crayon-striped-num" data-line="crayon-5706bac752017554634927-62">62</div> <div class="crayon-num" data-line="crayon-5706bac752017554634927-63">63</div> </div> </td> <td class="crayon-code"> <div class="crayon-pre"> <div id="crayon-5706bac752017554634927-1" class="crayon-line"><span class="crayon-ta"><?php</span></div> <div id="crayon-5706bac752017554634927-2" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-3" class="crayon-line"><span class="crayon-c">/* Include all the classes */</span></div> <div id="crayon-5706bac752017554634927-4" class="crayon-line crayon-striped-line"><span class="crayon-k">include</span><span class="crayon-sy">(</span><span class="crayon-s">“/srv/www/lib/pChart/class/pData.class.php”</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-5" class="crayon-line"><span class="crayon-k">include</span><span class="crayon-sy">(</span><span class="crayon-s">“/srv/www/lib/pChart/class/pDraw.class.php”</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-6" class="crayon-line crayon-striped-line"><span class="crayon-k">include</span><span class="crayon-sy">(</span><span class="crayon-s">“/srv/www/lib/pChart/class/pImage.class.php”</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-7" class="crayon-line"></div> <div id="crayon-5706bac752017554634927-8" class="crayon-line crayon-striped-line"><span class="crayon-c">/* Create your dataset object */</span></div> <div id="crayon-5706bac752017554634927-9" class="crayon-line"><span class="crayon-v">$myData</span> <span class="crayon-o">=</span> <span class="crayon-r">new</span> <span class="crayon-e">pData</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-10" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-11" class="crayon-line"><span class="crayon-v">$db</span> <span class="crayon-o">=</span> <span class="crayon-e">mysql_connect</span><span class="crayon-sy">(</span><span class="crayon-s">“localhost”</span><span class="crayon-sy">,</span> <span class="crayon-s">“piplanter_user”</span><span class="crayon-sy">,</span> <span class="crayon-s">“piplanter_pass”</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span> <span class="crayon-c">//location of server, db username, db pass</span></div> <div id="crayon-5706bac752017554634927-12" class="crayon-line crayon-striped-line"><span class="crayon-e">mysql_select_db</span><span class="crayon-sy">(</span><span class="crayon-s">“piplanter”</span><span class="crayon-sy">,</span> <span class="crayon-v">$db</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-13" class="crayon-line"></div> <div id="crayon-5706bac752017554634927-14" class="crayon-line crayon-striped-line"><span class="crayon-v">$Requete</span> <span class="crayon-o">=</span> <span class="crayon-s">“SELECT * FROM `piplanter_table_05`”</span><span class="crayon-sy">;</span> <span class="crayon-c">//table name</span></div> <div id="crayon-5706bac752017554634927-15" class="crayon-line"><span class="crayon-v">$Result</span> <span class="crayon-o">=</span> <span class="crayon-e">mysql_query</span><span class="crayon-sy">(</span><span class="crayon-v">$Requete</span><span class="crayon-sy">,</span> <span class="crayon-v">$db</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-16" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-17" class="crayon-line"><span class="crayon-c">/*This fetches the data from the mysql database, and adds it to pchart as points*/</span></div> <div id="crayon-5706bac752017554634927-18" class="crayon-line crayon-striped-line"><span class="crayon-st">while</span><span class="crayon-sy">(</span><span class="crayon-v">$row</span> <span class="crayon-o">=</span> <span class="crayon-e">mysql_fetch_array</span><span class="crayon-sy">(</span><span class="crayon-v">$Result</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span></div> <div id="crayon-5706bac752017554634927-19" class="crayon-line"><span class="crayon-sy">{</span></div> <div id="crayon-5706bac752017554634927-20" class="crayon-line crayon-striped-line"><span class="crayon-c">//$Sample_Number = $row[“Sample_Number”]; //Not using this data</span></div> <div id="crayon-5706bac752017554634927-21" class="crayon-line"><span class="crayon-c">//$myData->addPoints($Sample_Number,”Sample_Number”);</span></div> <div id="crayon-5706bac752017554634927-22" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-23" class="crayon-line"><span class="crayon-v">$Time</span> <span class="crayon-o">=</span> <span class="crayon-v">$row</span><span class="crayon-sy">[</span><span class="crayon-s">“Time”</span><span class="crayon-sy">]</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-24" class="crayon-line crayon-striped-line"><span class="crayon-v">$myData</span><span class="crayon-o">-></span><span class="crayon-e">addPoints</span><span class="crayon-sy">(</span><span class="crayon-v">$Time</span><span class="crayon-sy">,</span><span class="crayon-s">“Time”</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-25" class="crayon-line"></div> <div id="crayon-5706bac752017554634927-26" class="crayon-line crayon-striped-line"><span class="crayon-v">$Temp_F</span> <span class="crayon-o">=</span> <span class="crayon-v">$row</span><span class="crayon-sy">[</span><span class="crayon-s">“Temp_F”</span><span class="crayon-sy">]</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-27" class="crayon-line"><span class="crayon-v">$myData</span><span class="crayon-o">-></span><span class="crayon-e">addPoints</span><span class="crayon-sy">(</span><span class="crayon-v">$Temp_F</span><span class="crayon-sy">,</span><span class="crayon-s">“Temp_F”</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-28" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-29" class="crayon-line"><span class="crayon-v">$LDR_V</span> <span class="crayon-o">=</span> <span class="crayon-v">$row</span><span class="crayon-sy">[</span><span class="crayon-s">“LDR_V”</span><span class="crayon-sy">]</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-30" class="crayon-line crayon-striped-line"><span class="crayon-v">$myData</span><span class="crayon-o">-></span><span class="crayon-e">addPoints</span><span class="crayon-sy">(</span><span class="crayon-v">$LDR_V</span><span class="crayon-sy">,</span><span class="crayon-s">“LDR_V”</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-31" class="crayon-line"><span class="crayon-sy">}</span></div> <div id="crayon-5706bac752017554634927-32" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-33" class="crayon-line"><span class="crayon-v">$myData</span><span class="crayon-o">-></span> <span class="crayon-e">setSerieOnAxis</span><span class="crayon-sy">(</span><span class="crayon-s">“Temp_F”</span><span class="crayon-sy">,</span> <span class="crayon-cn">0</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span> <span class="crayon-c">//assigns the data to the frist axis</span></div> <div id="crayon-5706bac752017554634927-34" class="crayon-line crayon-striped-line"><span class="crayon-v">$myData</span><span class="crayon-o">-></span> <span class="crayon-e">setAxisName</span><span class="crayon-sy">(</span><span class="crayon-cn">0</span><span class="crayon-sy">,</span> <span class="crayon-s">“Temperature”</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span> <span class="crayon-c">//adds the label to the first axis</span></div> <div id="crayon-5706bac752017554634927-35" class="crayon-line"></div> <div id="crayon-5706bac752017554634927-36" class="crayon-line crayon-striped-line"><span class="crayon-v">$myData</span><span class="crayon-o">-></span> <span class="crayon-e">setSerieOnAxis</span><span class="crayon-sy">(</span><span class="crayon-s">“LDR_V”</span><span class="crayon-sy">,</span> <span class="crayon-cn">1</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-37" class="crayon-line"><span class="crayon-v">$myData</span><span class="crayon-o">-></span> <span class="crayon-e">setAxisName</span><span class="crayon-sy">(</span><span class="crayon-cn">1</span><span class="crayon-sy">,</span> <span class="crayon-s">“LDR”</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-38" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-39" class="crayon-line"><span class="crayon-v">$myData</span><span class="crayon-o">-></span> <span class="crayon-e">setAxisPosition</span><span class="crayon-sy">(</span><span class="crayon-cn">1</span><span class="crayon-sy">,</span><span class="crayon-cn">AXIS_POSITION_LEFT</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span> <span class="crayon-c">//moves the second axis to the far left</span></div> <div id="crayon-5706bac752017554634927-40" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-41" class="crayon-line"><span class="crayon-v">$myData</span><span class="crayon-o">-></span><span class="crayon-e">setAbscissa</span><span class="crayon-sy">(</span><span class="crayon-s">“Time”</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span> <span class="crayon-c">//sets the time data set as the x axis label</span></div> <div id="crayon-5706bac752017554634927-42" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-43" class="crayon-line"></div> <div id="crayon-5706bac752017554634927-44" class="crayon-line crayon-striped-line"><span class="crayon-v">$myPicture</span> <span class="crayon-o">=</span> <span class="crayon-r">new</span> <span class="crayon-e">pImage</span><span class="crayon-sy">(</span><span class="crayon-cn">1100</span><span class="crayon-sy">,</span><span class="crayon-cn">300</span><span class="crayon-sy">,</span><span class="crayon-v">$myData</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span> <span class="crayon-c">/* Create a pChart object and associate your dataset */</span></div> <div id="crayon-5706bac752017554634927-45" class="crayon-line"></div> <div id="crayon-5706bac752017554634927-46" class="crayon-line crayon-striped-line"><span class="crayon-v">$myPicture</span><span class="crayon-o">-></span><span class="crayon-e">setFontProperties</span><span class="crayon-sy">(</span><span class="crayon-t">array</span><span class="crayon-sy">(</span><span class="crayon-s">“FontName”</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-s">“/srv/www/lib/pChart/fonts/pf_arma_five.ttf”</span><span class="crayon-sy">,</span><span class="crayon-s">“FontSize”</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-cn">6</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span> <span class="crayon-c">/* Choose a nice font */</span></div> <div id="crayon-5706bac752017554634927-47" class="crayon-line"></div> <div id="crayon-5706bac752017554634927-48" class="crayon-line crayon-striped-line"><span class="crayon-v">$myPicture</span><span class="crayon-o">-></span><span class="crayon-e">setGraphArea</span><span class="crayon-sy">(</span><span class="crayon-cn">80</span><span class="crayon-sy">,</span><span class="crayon-cn">40</span><span class="crayon-sy">,</span><span class="crayon-cn">1000</span><span class="crayon-sy">,</span><span class="crayon-cn">200</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span> <span class="crayon-c">/* Define the boundaries of the graph area */</span></div> <div id="crayon-5706bac752017554634927-49" class="crayon-line"></div> <div id="crayon-5706bac752017554634927-50" class="crayon-line crayon-striped-line"><span class="crayon-v">$Settings</span> <span class="crayon-o">=</span> <span class="crayon-t">array</span><span class="crayon-sy">(</span><span class="crayon-s">“R”</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-cn">250</span><span class="crayon-sy">,</span> <span class="crayon-s">“G”</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-cn">250</span><span class="crayon-sy">,</span> <span class="crayon-s">“B”</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-cn">250</span><span class="crayon-sy">,</span> <span class="crayon-s">“Dash”</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-cn">1</span><span class="crayon-sy">,</span> <span class="crayon-s">“DashR”</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-cn">0</span><span class="crayon-sy">,</span> <span class="crayon-s">“DashG”</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-cn">0</span><span class="crayon-sy">,</span> <span class="crayon-s">“DashB”</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-cn">0</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-51" class="crayon-line"></div> <div id="crayon-5706bac752017554634927-52" class="crayon-line crayon-striped-line"><span class="crayon-v">$myPicture</span><span class="crayon-o">-></span><span class="crayon-e">drawScale</span><span class="crayon-sy">(</span><span class="crayon-t">array</span><span class="crayon-sy">(</span><span class="crayon-s">“LabelRotation”</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-cn">320</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span> <span class="crayon-c">/* Draw the scale, keep everything automatic */</span></div> <div id="crayon-5706bac752017554634927-53" class="crayon-line"></div> <div id="crayon-5706bac752017554634927-54" class="crayon-line crayon-striped-line"><span class="crayon-c">/*The combination makes a cool looking graph*/</span></div> <div id="crayon-5706bac752017554634927-55" class="crayon-line"><span class="crayon-v">$myPicture</span><span class="crayon-o">-></span><span class="crayon-e">drawPlotChart</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-56" class="crayon-line crayon-striped-line"><span class="crayon-v">$myPicture</span><span class="crayon-o">-></span><span class="crayon-e">drawLineChart</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div> <div id="crayon-5706bac752017554634927-57" class="crayon-line"></div> <div id="crayon-5706bac752017554634927-58" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-59" class="crayon-line"><span class="crayon-v">$myPicture</span><span class="crayon-o">-></span><span class="crayon-e">drawLegend</span><span class="crayon-sy">(</span><span class="crayon-cn">90</span><span class="crayon-sy">,</span><span class="crayon-cn">20</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span> <span class="crayon-c">//adds the legend</span></div> <div id="crayon-5706bac752017554634927-60" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-61" class="crayon-line"><span class="crayon-v">$myPicture</span><span class="crayon-o">-></span><span class="crayon-e">autoOutput</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span> <span class="crayon-c">/* Build the PNG file and send it to the web browser */</span></div> <div id="crayon-5706bac752017554634927-62" class="crayon-line crayon-striped-line"></div> <div id="crayon-5706bac752017554634927-63" class="crayon-line"><span class="crayon-ta">?></span></div> </div> </td> </tr> </tbody> </table> </div> </div> <div id="huge-it-share-buttons-top" class="huge-it-share-buttons nobackground"> <h3>Share This:</h3> <ul class="huge-it-share-buttons-list"> <li class=" nobackground"><a href="http://ift.tt/1LIxY7s" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/1LIxY7s','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -0px -120px" target="_blank"></a></li> <li class=" nobackground"><a href="https://twitter.com/share?status=http://yoursmart.mobi/feed&text=PiPlanter%20|%20Graphing%20timed%20mysql%20data%20with%20pchart" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('https://twitter.com/share?status=http://yoursmart.mobi/feed&text=PiPlanter | Graphing timed mysql data with pchart','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -30px -120px" target="_blank"></a></li> <li class=" nobackground"><a href="http://ift.tt/22fLIsm%20|%20Graphing%20timed%20mysql%20data%20with%20pchart" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/22fLIsm | Graphing timed mysql data with pchart','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -60px -120px" target="_blank"></a></li> <li class=" nobackground"><a href="http://ift.tt/1LIxZZ0" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/1LIxZZ0','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -90px -120px" target="_blank"></a></li> <li class=" nobackground"><a href="http://ift.tt/1qwJ5Hb%20|%20Graphing%20timed%20mysql%20data%20with%20pchart&mini=true&url=http://ift.tt/1LIxZZ4" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/1qwJ5Hb | Graphing timed mysql data with pchart&mini=true&url=http://ift.tt/1LIxZZ4','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -120px -120px" target="_blank"></a></li> <li class=" nobackground"><a href="http://ift.tt/22fLIss%20|%20Graphing%20timed%20mysql%20data%20with%20pchart" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/22fLIss | Graphing timed mysql data with pchart','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -150px -120px" target="_blank"></a></li> <li class=" nobackground"><a href="http://ift.tt/1qwJ8To%20|%20Graphing%20timed%20mysql%20data%20with%20pchart" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/1qwJ8To | Graphing timed mysql data with pchart','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -180px -120px" target="_blank"></a></li> <li class=" nobackground"><a href="http://ift.tt/22fLKAr%20|%20Graphing%20timed%20mysql%20data%20with%20pchart" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/22fLKAr | Graphing timed mysql data with pchart','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -210px -120px" target="_blank"></a></li> <li class=" nobackground"><a href="http://ift.tt/1LIxY7u" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/1LIxY7u','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -240px -120px" target="_blank"></a></li> <li class="none nobackground"><a href="http://ift.tt/1qwJ8Tx%20|%20Graphing%20timed%20mysql%20data%20with%20pchart" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/1qwJ8Tx | Graphing timed mysql data with pchart','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -270px -120px" target="_blank"></a></li> <li class="none nobackground"><a href="http://ift.tt/22fLKAt%20|%20Graphing%20timed%20mysql%20data%20with%20pchart" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/22fLKAt | Graphing timed mysql data with pchart','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -300px -120px" target="_blank"></a></li> <li class="none nobackground"><a href="http://ift.tt/1o7SuTq" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/1o7SuTq','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -330px -120px" target="_blank"></a></li> <li class="none nobackground"><a href="http://ift.tt/1qwJ8TA%20|%20Graphing%20timed%20mysql%20data%20with%20pchart" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/1qwJ8TA | Graphing timed mysql data with pchart','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -360px -120px" target="_blank"></a></li> <li class="none nobackground"><a href="http://ift.tt/1o7SuTs" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/1o7SuTs','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -390px -120px" target="_blank"></a></li> <li class="none nobackground"><a href="http://ift.tt/22fLKAD%20|%20Graphing%20timed%20mysql%20data%20with%20pchart" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/22fLKAD | Graphing timed mysql data with pchart','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -420px -120px" target="_blank"></a></li> <li class="none nobackground"><a href="http://ift.tt/1qwJ5XD%20|%20Graphing%20timed%20mysql%20data%20with%20pchart&pic=&ralateUid=&" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/1qwJ5XD | Graphing timed mysql data with pchart&pic=&ralateUid=&','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -450px -120px" target="_blank"></a></li> <li class="none nobackground"><a href="http://ift.tt/22fLIIO%20|%20Graphing%20timed%20mysql%20data%20with%20pchart" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/22fLIIO | Graphing timed mysql data with pchart','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -480px -120px" target="_blank"></a></li> <li class="none nobackground"><a href="http://ift.tt/1qwJ99U%20|%20Graphing%20timed%20mysql%20data%20with%20pchart" id="backforunical456" name="backforunical456" onclick="javascript:void window.open('http://ift.tt/1qwJ99U | Graphing timed mysql data with pchart','1410949501326','width=700,height=500,toolbar=0,menubar=0,location=0,status=1,scrollbars=1,resizable=1,left=0,top=0');return false;" style="background-position: -510px -120px" target="_blank"></a></li> </ul> <div class="clear"></div> </div> View more at: <a href="http://yoursmart.mobi/">http://yoursmart.mobi</a>

PiPlanter | Graphing timed mysql data with pchart

Time to get this data we’re harvesting graphed. In a couple past posts, I’ve used pChart to graph random data but now since data is getting ...

Read more »