51 lines
7.5 KiB
HTML
51 lines
7.5 KiB
HTML
|
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Chapter 20. Odometer</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="pt05.html" title="Part V. Additional graph types available in the professional version"></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">Chapter 20. Odometer</th></tr><tr><td width="20%" align="left"> </td><th width="60%" align="center">Part V. Additional graph types available in the professional version</th><td width="20%" align="right"> </td></tr></table><hr></div><div class="chapter" title="Chapter 20. Odometer"><div class="titlepage"><div><div><h2 class="title"><a name="id2583095"></a>Chapter 20. Odometer</h2></div></div></div><div class="toc"><p><b>Table of Contents</b></p><dl><dt><span class="sect1"><a href="ch20.html#id2583269">20.1. Introduction</a></span></dt><dd><dl><dt><span class="sect2"><a href="ch20.html#id2583278">20.1.1. Features</a></span></dt></dl></dd><dt><span class="sect1"><a href="ch20s02.html">20.2. Creating and formatting basic odometer graphs</a></span></dt><dd><dl><dt><span class="sect2"><a href="ch20s02.html#id2583483">20.2.1. A basic odometer</a></span></dt><dt><span class="sect2"><a href="ch20s02.html#id2583619">20.2.2. Half and Full Odometers</a></span></dt><dt><span class="sect2"><a href="ch20s02.html#id2583702">20.2.3. Adding titles and captions</a></span></dt><dt><span class="sect2"><a href="ch20s02.html#id2583801">20.2.4. Adjusting colors</a></span></dt><dt><span class="sect2"><a href="ch20s02.html#id2583878">20.2.5. Changing indicator needle style</a></span></dt><dt><span class="sect2"><a href="ch20s02.html#id2584050">20.2.6. Adding drop shadows</a></span></dt><dt><span class="sect2"><a href="ch20s02.html#id2584579">20.2.7. Changing sizes and margins</a></span></dt><dt><span class="sect2"><a href="ch20s02.html#id2584673">20.2.8. Adding color indications in the scale</a></span></dt><dt><span class="sect2"><a href="ch20s02.html#id2584762">20.2.9. Changing size of the non-colored center area</a></span></dt><dt><span class="sect2"><a href="ch20s02.html#id2584870">20.2.10. Using multiple indicator needles in one odometer</a></span></dt><dt><span class="sect2"><a href="ch20s02.html#id2584953">20.2.11. Adding an odometer legend (label)</a></span></dt><dt><span class="sect2"><a href="ch20s02.html#id2585069">20.2.12. Adjusting the width and color of the odometer frame (border)</a></span></dt></dl></dd><dt><span class="sect1"><a href="ch20s03.html">20.3. Working with the odometer scale</a></span></dt><dd><dl><dt><span class="sect2"><a href="ch20s03.html#id2585195">20.3.1. Adjusting the scale, ticks and labels</a></span></dt><dt><span class="sect2"><a href="ch20s03.html#id2585211">20.3.2. Adjusting scale label format</a></span></dt><dt><span class="sect2"><a href="ch20s03.html#id2585402">20.3.3. Adjusting the start and stop angle for the scale</a></span></dt></dl></dd><dt><span class="sect1"><a href="ch20s04.html">20.4. Adding and positioning multiple odometers to a graph</a></span></dt><dd><dl><dt><span class="sect2"><a href="ch20s04.html#id2585775">20.4.1. Manual positioning </a></span></dt><dt><span class="sect2"><a href="ch20s04.html#id2585835">20.4.2. Using layout classes</a></span></dt></dl></dd><dt><span class="sect1"><a href="ch20s05.html">20.5. Adding icon and text objects to the graph</a></span></dt><dd><dl><dt><span class="sect2"><a href="ch20s05.html#id2586038">20.5.1. Adding a text object</a></span></dt><dt><span class="sect2"><a href="ch20s05.html#id2586040">20.5.2. Adding icons to the graph</a></span></dt><dt><span class="sect2"><a href="ch20s05.html#id2586237">20.5.3. Adding background images</a></span></dt></dl></dd></dl></div>
|
|||
|
|
|||
|
<div class="sect1" title="Introduction"><div class="titlepage"><div><div><h2 class="title" style="clear: both"><a name="id2583269"></a>Introduction</h2></div></div></div>
|
|||
|
|
|||
|
<div class="note" title="Note" style="margin-left: 0.5in; margin-right: 0.5in;"><h3 class="title">Note</h3><p>This module is only available in the pro-version of the library.</p></div>
|
|||
|
<p>Odometer graphs uses the metaphor of an old fashioned speedometer for cars. It is
|
|||
|
normally used to give a quick overview of one specific parameter. Experience have shown
|
|||
|
that this type of metaphor is easily and quickly understood by most people. By adding
|
|||
|
color indications to the odometer it is very quick to see whether or not a specific
|
|||
|
value is within a allowed range or outside. </p>
|
|||
|
<p><a class="xref" href="ch20.html#fig.odometer-bulletin" title="Figure 20.1. Odometers">Figure 20.1. Odometers</a> shows an overview of some typical
|
|||
|
odometers created with the library.</p>
|
|||
|
<div class="figure"><a name="fig.odometer-bulletin"></a><p class="title"><b>Figure 20.1. Odometers</b></p><div class="figure-contents">
|
|||
|
|
|||
|
<div class="mediaobject"><img src="images/odometer_bulletin.png" alt="Odometers"></div>
|
|||
|
</div></div><br class="figure-break">
|
|||
|
<div class="sect2" title="Features"><div class="titlepage"><div><div><h3 class="title"><a name="id2583278"></a>Features</h3></div></div></div>
|
|||
|
|
|||
|
<p>Odometers produced with this package have a wide range of functionality and as you
|
|||
|
would expect almost every bit of visual layout is in one way or the other
|
|||
|
customisable. For simple use there are suitable default values for most parameters
|
|||
|
which will make creation of simple Odometer just a matter of a few lines of code. </p>
|
|||
|
<p>Among other things Odometers support the following features: </p>
|
|||
|
<p>
|
|||
|
</p><div class="itemizedlist"><ul class="itemizedlist" type="disc"><li class="listitem">
|
|||
|
<p>Both half (semi-circle) and full (circle) odometers are supported
|
|||
|
</p>
|
|||
|
</li><li class="listitem">
|
|||
|
<p>Fully customizable scales and odometer sizes</p>
|
|||
|
</li><li class="listitem">
|
|||
|
<p>Different size and shapes of the indicator needles</p>
|
|||
|
</li><li class="listitem">
|
|||
|
<p>Scale color indicators</p>
|
|||
|
</li><li class="listitem">
|
|||
|
<p>Multiple dials in the same graph</p>
|
|||
|
</li><li class="listitem">
|
|||
|
<p>Full support for library standard fonts and colors</p>
|
|||
|
</li><li class="listitem">
|
|||
|
<p>Automatic layout engine for multiple plots in the same graph which
|
|||
|
aids in positioning of the graphs without having to specify pixel
|
|||
|
coordinates</p>
|
|||
|
</li></ul></div><p>
|
|||
|
</p>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
|
|||
|
|
|||
|
|
|||
|
|
|||
|
</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="pt05.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>
|