<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Creating a utility class to construct CC BP charts</title><link rel="stylesheet" type="text/css" href="manual.css"><meta name="generator" content="DocBook XSL Stylesheets V1.76.0"><link rel="home" href="index.html" title="JpGraph Manual"><link rel="up" href="ch35.html" title="Chapter 35. Creating Critical chain buffer penetration charts"></head><body bgcolor="white" text="black" link="#0000FF" vlink="#840084" alink="#0000FF"><div class="navheader"><table width="100%" summary="Navigation header"><tr><th colspan="3" align="center">Creating a utility class to construct CC BP charts</th></tr><tr><td width="20%" align="left"> </td><th width="60%" align="center">Chapter 35. Creating Critical chain buffer penetration charts</th><td width="20%" align="right"> </td></tr></table><hr></div><div class="sect1" title="Creating a utility class to construct CC BP charts"><div class="titlepage"><div><div><h2 class="title" style="clear: both"><a name="id2621713"></a>Creating a utility class to construct CC BP charts</h2></div></div></div>
            
            <p>We will start from a high level and think about how we would like to be able to
                use such a utility class. Ideally it would be similar to other types of graphs
                classes. To keep things simple we want the following parameter to be
                adjustable</p>
            <p>
                </p><div class="itemizedlist"><ul class="itemizedlist" type="disc"><li class="listitem">
                        <p>The min and max x- and y-axis scale values to be displayed in the
                            graph</p>
                    </li><li class="listitem">
                        <p>The limits for the color indications, i.e. exactly what is the green,
                            yellow, red and brown areas should be customizable. In oder to keep the
                            interface simple we assume that the areas are bounded by straight lines
                            and that we want to be able to specify the areas by stating the value at
                            x=0 and the value at x=maximum x-scale </p>
                        <p>So for example the standard green area is limited by the specification
                            (5,75) meaning that the green line crosses y=5 at x=0 and y=75 at
                            x=100</p>
                    </li><li class="listitem">
                        <p>We would also like to be ale to adjust the colors used as
                            indicators</p>
                    </li><li class="listitem">
                        <p>We want to be able to add both scatter marks and lines (to show
                            history)</p>
                    </li><li class="listitem">
                        <p>We also need to be able to specify the title and the sub title</p>
                    </li><li class="listitem">
                        <p>The rest of the graph options and setting we would like the utility
                            class to handle for us. As a bonus it would be nice if the class
                            adjusted the size of the fonts to the overall size we have specified for
                            the graph automatically to make it look visually proportional.</p>
                    </li></ul></div><p>
            </p>
            <p>When doing designs like this it is always good to first write a small test driver
                without having to think about how to actually implement it. This keeps an end user
                perspective on things. Later on we can do changes if it turns out that a particular
                simplification for the user is simply too complex to implement.</p>
            <p>So, lets think about how we (ideally) would like to be able to create the chart
                shown in <a class="xref" href="ch35.html#fig.ccbp-historic-chart" title='Figure 35.3. Buffer penetration chart with "historic" tail'>Figure 35.3. Buffer penetration chart with "historic" tail</a></p>
            <p>
                </p><div class="hl-main"><table class="hl-table" width="100%"><tr><td class="hl-gutter" align="right" valign="top"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
</pre></td><td class="hl-main" valign="top"><pre><span class="hl-inlinetags">&lt;?php</span><span class="hl-code">
</span><span class="hl-var">$graph</span><span class="hl-code"> = </span><span class="hl-reserved">new</span><span class="hl-code"> </span><span class="hl-identifier">CCBPGraph</span><span class="hl-brackets">(</span><span class="hl-number">300</span><span class="hl-code">,</span><span class="hl-number">250</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-var">$graph</span><span class="hl-code">-&gt;</span><span class="hl-identifier">SetTitle</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">Buffer penetration</span><span class="hl-quotes">'</span><span class="hl-code">,</span><span class="hl-quotes">'</span><span class="hl-string">(history)</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
 
</span><span class="hl-var">$datax</span><span class="hl-code">=</span><span class="hl-reserved">array</span><span class="hl-brackets">(</span><span class="hl-number">83</span><span class="hl-brackets">)</span><span class="hl-code">; </span><span class="hl-var">$datay</span><span class="hl-code">=</span><span class="hl-reserved">array</span><span class="hl-brackets">(</span><span class="hl-number">60</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-var">$datax_history</span><span class="hl-code"> = </span><span class="hl-reserved">array</span><span class="hl-brackets">(</span><span class="hl-number">0</span><span class="hl-code">,</span><span class="hl-number">17</span><span class="hl-code">,</span><span class="hl-number">17</span><span class="hl-code">,</span><span class="hl-number">17</span><span class="hl-code">,</span><span class="hl-number">33</span><span class="hl-code">,</span><span class="hl-number">50</span><span class="hl-code">,</span><span class="hl-number">67</span><span class="hl-code">,</span><span class="hl-number">83</span><span class="hl-brackets">)</span><span class="hl-code">; 
</span><span class="hl-var">$datay_history</span><span class="hl-code"> = </span><span class="hl-reserved">array</span><span class="hl-brackets">(</span><span class="hl-number">0</span><span class="hl-code">,</span><span class="hl-number">20</span><span class="hl-code">,</span><span class="hl-number">40</span><span class="hl-code">,</span><span class="hl-number">60</span><span class="hl-code">,</span><span class="hl-number">60</span><span class="hl-code">,</span><span class="hl-number">60</span><span class="hl-code">,</span><span class="hl-number">60</span><span class="hl-code">,</span><span class="hl-number">60</span><span class="hl-brackets">)</span><span class="hl-code">;
 
</span><span class="hl-var">$sp</span><span class="hl-code"> = </span><span class="hl-reserved">new</span><span class="hl-code"> </span><span class="hl-identifier">ScatterPlot</span><span class="hl-brackets">(</span><span class="hl-var">$datay</span><span class="hl-code">,</span><span class="hl-var">$datax</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-var">$sp</span><span class="hl-code">-&gt;</span><span class="hl-identifier">mark</span><span class="hl-code">-&gt;</span><span class="hl-identifier">SetType</span><span class="hl-brackets">(</span><span class="hl-identifier">MARK_DIAMOND</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-var">$sp</span><span class="hl-code">-&gt;</span><span class="hl-identifier">mark</span><span class="hl-code">-&gt;</span><span class="hl-identifier">SetFillColor</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">white</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-var">$sp</span><span class="hl-code">-&gt;</span><span class="hl-identifier">mark</span><span class="hl-code">-&gt;</span><span class="hl-identifier">SetSize</span><span class="hl-brackets">(</span><span class="hl-number">10</span><span class="hl-brackets">)</span><span class="hl-code">;
 
</span><span class="hl-var">$sp_hist</span><span class="hl-code"> = </span><span class="hl-reserved">new</span><span class="hl-code"> </span><span class="hl-identifier">LinePlot</span><span class="hl-brackets">(</span><span class="hl-var">$datay2</span><span class="hl-code">,</span><span class="hl-var">$datax2</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-var">$sp_hist</span><span class="hl-code">-&gt;</span><span class="hl-identifier">SetWeight</span><span class="hl-brackets">(</span><span class="hl-number">2</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-var">$sp_hist</span><span class="hl-code">-&gt;</span><span class="hl-identifier">SetColor</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">black</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
 
</span><span class="hl-var">$graph</span><span class="hl-code">-&gt;</span><span class="hl-identifier">Add</span><span class="hl-brackets">(</span><span class="hl-var">$sp_hist</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-var">$graph</span><span class="hl-code">-&gt;</span><span class="hl-identifier">Add</span><span class="hl-brackets">(</span><span class="hl-var">$sp</span><span class="hl-brackets">)</span><span class="hl-code">;
 
</span><span class="hl-var">$graph</span><span class="hl-code">-&gt;</span><span class="hl-identifier">Stroke</span><span class="hl-brackets">(</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-inlinetags">?&gt;</span></pre></td></tr></table></div><p>
            </p>
            <p>We cannot hope to have the class make it any simpler than this. This is as close
                to a "normal" line graph we can get (apart from the color indications in the
                background). So now its just a matter on designing this class.</p>
            <p>Since the utility class will be a rather restricted graph class it with a very
                specific usage it doesn't make sense to implement it as an extension to the normal
                graph. Instead we will create contain class that contains a graph that we can modify
                and setup. (In UML language a <span class="italic">has-a</span>
                relation.)</p>
            <p>We will name our utility class <code class="code">CCBPGraph</code> (Short for <span class="italic">Critical chain Buffer Penetration Graph</span>). The class
                should have the following signature</p>
            <p>
                </p><div class="hl-main"><table class="hl-table" width="100%"><tr><td class="hl-gutter" align="right" valign="top"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
</pre></td><td class="hl-main" valign="top"><pre><span class="hl-inlinetags">&lt;?php</span><span class="hl-code">
</span><span class="hl-reserved">class</span><span class="hl-code"> </span><span class="hl-identifier">CCBPGraph</span><span class="hl-brackets">{</span><span class="hl-code"> 
    </span><span class="hl-reserved">private</span><span class="hl-code"> </span><span class="hl-var">$graph</span><span class="hl-code"> = </span><span class="hl-reserved">null</span><span class="hl-code"> ; </span><span class="hl-comment">//</span><span class="hl-comment"> The real graph instance</span><span class="hl-comment"></span><span class="hl-code">
 
    </span><span class="hl-comment">//</span><span class="hl-comment"> The &quot;normal&quot; constructor</span><span class="hl-comment"></span><span class="hl-code">
    </span><span class="hl-reserved">public</span><span class="hl-code"> </span><span class="hl-reserved">function</span><span class="hl-code"> </span><span class="hl-identifier">__construct</span><span class="hl-brackets">(</span><span class="hl-var">$aWidth</span><span class="hl-code">,</span><span class="hl-var">$aHeight</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-brackets">}</span><span class="hl-code">
 
    </span><span class="hl-comment">//</span><span class="hl-comment"> Methods that will control the appearance</span><span class="hl-comment"></span><span class="hl-code">
    </span><span class="hl-reserved">public</span><span class="hl-code"> </span><span class="hl-reserved">function</span><span class="hl-code"> </span><span class="hl-identifier">SetTitle</span><span class="hl-brackets">(</span><span class="hl-var">$aTitle</span><span class="hl-code">,</span><span class="hl-var">$aSubTitle</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-brackets">}</span><span class="hl-code">
    </span><span class="hl-reserved">public</span><span class="hl-code"> </span><span class="hl-reserved">function</span><span class="hl-code"> </span><span class="hl-identifier">SetXMinMax</span><span class="hl-brackets">(</span><span class="hl-var">$aMin</span><span class="hl-code">,</span><span class="hl-var">$aMax</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-brackets">}</span><span class="hl-code">
    </span><span class="hl-reserved">public</span><span class="hl-code"> </span><span class="hl-reserved">function</span><span class="hl-code"> </span><span class="hl-identifier">SetYMinMax</span><span class="hl-brackets">(</span><span class="hl-var">$aMin</span><span class="hl-code">,</span><span class="hl-var">$aMax</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-brackets">}</span><span class="hl-code">
    </span><span class="hl-reserved">public</span><span class="hl-code"> </span><span class="hl-reserved">function</span><span class="hl-code"> </span><span class="hl-identifier">SetColorIndication</span><span class="hl-brackets">(</span><span class="hl-var">$aSpec</span><span class="hl-code">,</span><span class="hl-var">$aColors</span><span class="hl-code">=</span><span class="hl-reserved">null</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-brackets">}</span><span class="hl-code">
    </span><span class="hl-reserved">public</span><span class="hl-code"> </span><span class="hl-reserved">function</span><span class="hl-code"> </span><span class="hl-identifier">SetColorMap</span><span class="hl-brackets">(</span><span class="hl-var">$aMap</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-brackets">}</span><span class="hl-code">
    
    </span><span class="hl-comment">//</span><span class="hl-comment"> Internal function to create and setup the graph</span><span class="hl-comment"></span><span class="hl-code">
    </span><span class="hl-reserved">private</span><span class="hl-code"> </span><span class="hl-reserved">function</span><span class="hl-code"> </span><span class="hl-identifier">Init</span><span class="hl-brackets">(</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-brackets">}</span><span class="hl-code">
    
    </span><span class="hl-comment">//</span><span class="hl-comment"> Mimix the standard graph functions Add() and Stroke()</span><span class="hl-comment"></span><span class="hl-code">
    </span><span class="hl-reserved">public</span><span class="hl-code"> </span><span class="hl-reserved">function</span><span class="hl-code"> </span><span class="hl-identifier">Add</span><span class="hl-brackets">(</span><span class="hl-var">$aPlots</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-brackets">}</span><span class="hl-code">
    </span><span class="hl-reserved">public</span><span class="hl-code"> </span><span class="hl-reserved">function</span><span class="hl-code"> </span><span class="hl-identifier">Stroke</span><span class="hl-brackets">(</span><span class="hl-var">$aFile</span><span class="hl-code">=</span><span class="hl-quotes">'</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-brackets">}</span><span class="hl-code">
</span><span class="hl-brackets">}</span><span class="hl-code">
</span><span class="hl-inlinetags">?&gt;</span></pre></td></tr></table></div><p>
            </p>
            <p>In addition the class must have a number of instance variables that are used to
                store the settings until we need them when we create the graph. However to keep
                things simple here we do not list them above. Lets now walk through the four groups
                of methods.</p>
            <p>
                </p><div class="orderedlist"><ol class="orderedlist" type="1"><li class="listitem">
                        <p>The constructor</p>
                        <p>
                            </p><pre class="screen">public function __construct($aWidth,$aHeight) {}</pre><p>
                        </p>
                        <p>The constructor doesn't need to do very much. It just needs to store
                            the user specified width and height so we get them back when we create
                            the actual graph. We could also make use of the constructor to create an
                            instance of the real graph class but we prefer to do as late as possible
                            instantiation.</p>
                    </li><li class="listitem">
                        <p>Controlling the appearance of the graph. </p>
                        <p>Again these methods will be very basic "setter" methods that will just
                            store the user specified options until we need them when we construct
                            the graph</p>
                        <p>
                            </p><pre class="screen">public function SetTitle($aTitle,$aSubTitle) {} 
public function SetXMinMax($aMin,$aMax) {} 
public function SetYMinMax($aMin,$aMax) {} 
public function SetColorIndication($aSpec,$aColors=null) {}
public function SetColorMap($aMap) {}</pre><p>
                        </p>
                        <p>For the color setter we should also add some basic error checking so
                            that the parameter makes sense.</p>
                    </li><li class="listitem">
                        <p>The real worker method</p>
                        <p>
                            </p><pre class="screen">private function Init() {}</pre><p>
                        </p>
                        <p>Since this is the method is where we will do the actual work and will
                            be fairly large we will spend the entire next section on this
                            method.</p>
                    </li><li class="listitem">
                        <p>The "fake" standard methods. Add() and Stroke(). Since these are
                            fairly short we will show them here in there entirety</p>
                        <p>
                            </p><div class="hl-main"><table class="hl-table" width="100%"><tr><td class="hl-gutter" align="right" valign="top"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
</pre></td><td class="hl-main" valign="top"><pre><span class="hl-inlinetags">&lt;?php</span><span class="hl-code">
</span><span class="hl-reserved">function</span><span class="hl-code"> </span><span class="hl-identifier">Add</span><span class="hl-brackets">(</span><span class="hl-var">$aPlots</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-code">
    </span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-code"> </span><span class="hl-identifier">is_array</span><span class="hl-brackets">(</span><span class="hl-var">$aPlots</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-code">
        </span><span class="hl-var">$this</span><span class="hl-code">-&gt;</span><span class="hl-identifier">iPlots</span><span class="hl-code"> = </span><span class="hl-identifier">array_merge</span><span class="hl-brackets">(</span><span class="hl-var">$this</span><span class="hl-code">-&gt;</span><span class="hl-identifier">iPlots</span><span class="hl-code">,</span><span class="hl-var">$aPlots</span><span class="hl-brackets">)</span><span class="hl-code">;                
    </span><span class="hl-brackets">}</span><span class="hl-code">
    </span><span class="hl-reserved">else</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-code">
        </span><span class="hl-var">$this</span><span class="hl-code">-&gt;</span><span class="hl-identifier">iPlots</span><span class="hl-brackets">[</span><span class="hl-brackets">]</span><span class="hl-code"> = </span><span class="hl-var">$aPlots</span><span class="hl-code">;
    </span><span class="hl-brackets">}</span><span class="hl-code">
</span><span class="hl-brackets">}</span><span class="hl-code">
    
</span><span class="hl-reserved">function</span><span class="hl-code"> </span><span class="hl-identifier">Stroke</span><span class="hl-brackets">(</span><span class="hl-var">$aFile</span><span class="hl-code">=</span><span class="hl-quotes">'</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code"> </span><span class="hl-brackets">{</span><span class="hl-code">
    </span><span class="hl-var">$this</span><span class="hl-code">-&gt;</span><span class="hl-identifier">Init</span><span class="hl-brackets">(</span><span class="hl-brackets">)</span><span class="hl-code">;
    </span><span class="hl-var">$this</span><span class="hl-code">-&gt;</span><span class="hl-identifier">graph</span><span class="hl-code">-&gt;</span><span class="hl-identifier">Add</span><span class="hl-brackets">(</span><span class="hl-var">$this</span><span class="hl-code">-&gt;</span><span class="hl-identifier">iPlots</span><span class="hl-brackets">)</span><span class="hl-code">;
    </span><span class="hl-var">$this</span><span class="hl-code">-&gt;</span><span class="hl-identifier">graph</span><span class="hl-code">-&gt;</span><span class="hl-identifier">Stroke</span><span class="hl-brackets">(</span><span class="hl-var">$aFile</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">
</span><span class="hl-inlinetags">?&gt;</span></pre></td></tr></table></div><p>
                        </p>
                        <p>When adding plots (with the <code class="code">Add()</code> method) we have to take
                            into account that the parameter can be either a single object or an
                            array of plot objects (line and scatter plots) and we must handle that
                            accordingly as is done above.</p>
                        <p>For the <code class="code">Stroke()</code> method we use this to call the
                            initialization method (to actually create the graph) and then add the
                            user specified plots and finally call the real
                                <code class="code">Graph::Stroke()</code> of the graph.</p>
                        <p>These methods are very simple but from the outside it will look like a
                            "real" graph class with a clean and simple interface. </p>
                    </li></ol></div><p>
            </p>
        </div><div class="navfooter"><hr><table width="100%" summary="Navigation footer"><tr><td width="40%" align="left"> </td><td width="20%" align="center"><a accesskey="u" href="ch35.html">Up</a></td><td width="40%" align="right"> </td></tr><tr><td width="40%" align="left" valign="top"> </td><td width="20%" align="center"><a accesskey="h" href="index.html">Home</a></td><td width="40%" align="right" valign="top"> </td></tr></table></div></body></html>