ASE Home Page Products Download Purchase Support About ASE
ChartDirector General
 Forum HomeForum Home   SearchSearch

Message ListMessage List     Post MessagePost Message

  gauge (round meter) size
Posted by frenky tambunan on Oct-08-2012 15:10
| Reply | Monitor
Attachments:
Hi Peter it's me again,

I want to ask how to re-size the gauge (I don't know what it called, maybe scale) from the default form into my custom arrangement.

This sample of my gauge code in "reportGaugeOS.php" :

<?php
require_once("../rfb/lib/phpchartdir.php");

#
# Retrieve the data from the query parameters
#

$selectedArea = $_REQUEST["area"];

$iOS = (int)$_REQUEST["iOS"];

# The value to display on the meter
$value = (int)$iOS;

# Create an AugularMeter object of size 200 x 200 pixels, with silver background,
# black border, 2 pixel 3D depressed border and rounded corners.
$m = new AngularMeter(200, 230);
$m->setRoundedFrame();
$m->setDropShadow(0x00C0C0C0, -1,5,10);

# Add a title box using 15 pts Times Bold Italic font and metallic pink background
# color
$textBoxObj = $m->addTitle("Achv. Outstanding", "calibrib.ttf", 15,0x5500ff);

# Set the meter center at (100, 100), with radius 85 pixels, and span from -135 to
# +135 degress
//$m->setMeter(100, 100, 85, -135, 135);
$m->setMeter(100, 130, 65, -135, 135);

# Meter scale is 0 - 100, with major tick every 10 units, minor tick every 5 units,
# and micro tick every 1 units
//$m->setScale(0, 100, 10, 5, 1);
$m->setScale(0, 200, 20, 10, 1);

# Disable default angular arc by setting its width to 0. Set 2 pixels line width for
# major tick, and 1 pixel line width for minor ticks.
$m->setLineWidth(0, 2, 1);

# Set the circular meter surface as metallic blue (9999DD)
//$m->addRing(0, 90, metalColor(0x9999dd));
$m->addRing(0, 90, SilverColor());

# Add a blue (6666FF) ring between radii 88 - 90 as decoration
$m->addRing(88, 90, 0xccccff);

# Set 0 - 60 as green (99FF99) zone, 60 - 80 as yellow (FFFF00) zone, and 80 - 100 as
# red (FF3333) zone
$m->addZone(0, 70, 0xff1100);
$m->addZone(70, 100, 0xffff00);
$m->addZone(100, 125, 0x00ff00);
$m->addZone(125, 200, 0x0000FF);

# Add a text label centered at (100, 135) with 15 pts Arial Bold font
//$m->addText(100, 135, "NOC", "arialbd.ttf", 15, TextColor, Center);
$m->addText(100, 160, "OS", "arialbd.ttf", 15, 0x8855CC, Center);

# Add a text box centered at (100, 165) showing the value formatted to 2 decimal
# places, using white text on a black background, and with 1 pixel 3D depressed
# border
//$textBoxObj = $m->addText(100, 165, $m->formatValue($value, "2"), "arial.ttf", 8, 0xffffff, Center);
$textBoxObj = $m->addText(100, 190, $m->formatValue($value, "2") . " %", "arial.ttf", 8, 0xffffff, Center);
$textBoxObj->setBackground(0x008080FF, 0x000000, -1);

# Add a semi-transparent blue (40333399) pointer at the specified value
$m->addPointer($value, 0x40333399);

# Output the chart
header("Content-type: image/png");
print($m->makeChart2(PNG));
?>

I also attach the picture of my custom gauge which is I want to change the size. I have change the radius from 85 to 65 such as below :
$m->setMeter(100, 130, 65, -135, 135);

and the chart shows like in the picture, it just reduce the circle of meter scale, not the size/diameter of the gauge. The question is, How to change the diameter/scale/size of the gauge?

I'm gonna need your help again... hehehehehe...

Thank You.
Regards
Frenky Tambunan
gauge-size.jpg

  Re: gauge (round meter) size
Posted by Peter Kwan on Oct-08-2012 23:21
| Reply | Monitor
Hi frenky,

Do you mean you want to reduce the size of the "blue ring"? The "blue ring" and the associated background color is current configured in your code using:

$m->addRing(0, 90, SilverColor());

# Add a blue (6666FF) ring between radii 88 - 90 as decoration
$m->addRing(88, 90, 0xccccff);

You may change them to:

$m->addRing(0, 70, SilverColor());

# Add a blue (6666FF) ring between radii 88 - 90 as decoration
$m->addRing(68, 70, 0xccccff);

Hope this can help.

Regards
Peter Kwan

  Re: gauge (round meter) size
Posted by frenky tambunan on Oct-09-2012 17:26
| Reply | Monitor
Attachments:
Thank You Peter, as usual, It works again...

Oh, I have another question. In this picture post that I attach, there's a value "1606". The question is how to change it into "1.606" ?
As my code below in "reportGaugeOS.php" :

<?php
require_once("../rfb/lib/phpchartdir.php");

#
# Retrieve the data from the query parameters
#

$selectedArea = $_REQUEST["area"];

$iOS = (int)$_REQUEST["iOS"];
$iActOS = (int)$_REQUEST["iActOS"];
$iPlanOS = (int)$_REQUEST["iPlanOS"];

# The value to display on the meter
$value = (int)$iOS;

# Create an AugularMeter object of size 200 x 200 pixels, with silver background,
# black border, 2 pixel 3D depressed border and rounded corners.
$m = new AngularMeter(200, 230);
$m->setRoundedFrame();
$m->setDropShadow(0x00C0C0C0, -1,5,10);

# Add a title box using 15 pts Times Bold Italic font and metallic pink background
# color
$textBoxObj = $m->addTitle("Achv. Outstanding", "calibrib.ttf", 15,0x5500ff);

# Set the meter center at (100, 100), with radius 85 pixels, and span from -135 to
# +135 degress
$m->setMeter(100, 130, 85, -135, 135);

# Meter scale is 0 - 100, with major tick every 10 units, minor tick every 5 units,
# and micro tick every 1 units
$m->setScale(0, 200, 20, 10, 1);

# Disable default angular arc by setting its width to 0. Set 2 pixels line width for
# major tick, and 1 pixel line width for minor ticks.
$m->setLineWidth(0, 2, 1);

# Set the circular meter surface as metallic blue (9999DD)
$m->addRing(0, 90, SilverColor());

# Add a blue (6666FF) ring between radii 88 - 90 as decoration
$m->addRing(88, 90, 0xccccff);

# Set 0 - 60 as green (99FF99) zone, 60 - 80 as yellow (FFFF00) zone, and 80 - 100 as
# red (FF3333) zone
$m->addZone(0, 70, 0xff1100);
$m->addZone(70, 100, 0xffff00);
$m->addZone(100, 125, 0x00ff00);
$m->addZone(125, 200, 0x0000FF);

# Add a text label centered at (100, 135) with 15 pts Arial Bold font
$m->addText(100, 190, "A: $iActOS", "arialbd.ttf", 10, 0xff8800, Center);
$m->addText(100, 205, "P: $iPlanOS", "arialbd.ttf", 10, 0xff8800, Center);

# Add a text box centered at (100, 165) showing the value formatted to 2 decimal
# places, using white text on a black background, and with 1 pixel 3D depressed
# border
//$textBoxObj = $m->addText(100, 165, $m->formatValue($value, "2"), "arial.ttf", 8, 0xffffff, Center);
$textBoxObj = $m->addText(100, 165, $m->formatValue($value, "2") . " %", "tahomabd.ttf", 8, 0xffffff, Center);
$textBoxObj->setBackground(0x008080FF, 0x000000, -1);

# Add a semi-transparent blue (40333399) pointer at the specified value
$m->addPointer($value, 0x40333399);

# Output the chart
header("Content-type: image/png");
print($m->makeChart2(PNG));
?>


is there any improvement that I must change in this :
$m->addText(100, 190, "A: $iActOS", "arialbd.ttf", 10, 0xff8800, Center);
$m->addText(100, 205, "P: $iPlanOS", "arialbd.ttf", 10, 0xff8800, Center);

or there is another way to make that happen?

Thank you.

Regards,
Frenky Tambunan
gauge_currency.jpg

  Re: gauge (round meter) size
Posted by Peter Kwan on Oct-10-2012 01:47
| Reply | Monitor
Hi frenky,

Is the "." in "1.606" the decimal separator, or is it the thousand separator?

If you would like to add the decimal separate to "1606" so that it becomes "1.606", please divide the number by 1000. For example:

$iActOS = $iActOS / 1000.0;

If it is a thousand separator, please use:

$iActOS = $c->formatValue($iActOS, "{value|.}");

Note that a decimal separator is different from a thousand separator. For example, if the value is "123", using a decimal separator the value will become "0.123". On the other hand, using a thousand separator, it will become "123"

Hope this can help.

Regards
Peter Kwan

  Re: gauge (round meter) size
Posted by frenky tambunan on Oct-11-2012 17:25
| Reply | Monitor
Thank You Peter,

It works again...

And another question, how can i set the meter scale label font and font-size?

I think this framework contains many secret that I must explorer with... so good...


Thank you for your support.

Regards,
Frenky Tambunan

  Re: gauge (round meter) size
Posted by Peter Kwan on Oct-12-2012 00:44
| Reply | Monitor
Hi frenky,

The API is BaseMeter.setLabelStyle. See:

http://www.advsofteng.com/doc/cdphp.htm#BaseMeter.setLabelStyle.htm

For example:

#Arial 10 points
$m->setLabelStyle("arial.ttf", 10);

Hope this can help.

Regards
Peter Kwan