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

Message ListMessage List     Post MessagePost Message

  side bar with html map
Posted by Haim on Oct-28-2011 06:58
| Reply | Monitor
Attachments:
What is the best way to achieve this:
1. side bar with 3 bars per "date", if data for "date" < 0 , show abs(data) but make it stripe color - this part is done, see attached image
2. make html map , but b/c I have 2 layers per each datapoint, I get y=0 when mouse next to x=0 and y=yvalue when mouse over bar
How I can remove duplicate html map points ( keep only yvalue > 0)
thanks

code:
$data1=[2,1,NoValue,3,6];
$data1neg=[NoValue,NoValue,3,NoValue,NoValue];

$data2=[1,NoValue,4,5,3];
$data2neg=[NoValue,4,NoValue,NoValue,NoValue];

$data3=[10,12,6,8,NoValue];
$data3neg=[NoValue,NoValue,NoValue,NoValue,5];

$labels=['1/1','1/2','1/3','1/4','1/5'];

$maxx=800;
$maxy=300;
my $c = new XYChart($maxx,$maxy);

$c->setPlotArea(50, 25, int($maxx*0.8),int($maxy*0.55),0xD9D9D9);#, 0xffffc0, 0xffffe0);

$c->addLegend($maxx/13, $maxy*0.76)->setBackground(-1,0xFFFFFF);

$c->yAxis()->setLinearScale(0,20);

$tx=$c->xAxis()->setLabels($labels);
$tx->setFontStyle("arialbi.ttf");
$tx->setFontSize(9);
$tx->setFontAngle(60);

my $layer = $c->addBarLayer2($perlchartdir::Side, 0);
my $firstlayer = $c->addBarLayer2($perlchartdir::Side, 0);

$firstlayer->addDataSet($data1neg, $c->patternColor([0xffffff, 0x0000FF], 3), "");
$firstlayer->addDataSet($data2neg, $c->patternColor([0xffffff, 0x00FF00], 3), "");
$firstlayer->addDataSet($data3neg, $c->patternColor([0xffffff, 0xFF0000], 3), "");

$layer->addDataSet($data1, 0x948A54, "<*font=arialbd.ttf,size=10,color=948A54*>data1");
$layer->addDataSet($data2, 0x0000ff, "<*font=arialbd.ttf,size=10,color=0000ff*>data2");
$layer->addDataSet($data3, 0xDC8B72, "<*font=arialbd.ttf,size=10,color=DC8B72*>data3");

my $chart1URL = $c->makeTmpFile("tmp/tmpcharts");

my $imageMap = $c->getHTMLImageMap("", "",
    "title='{xLabel}: {value|1}'");

print "Content-type: text/html\\n\\n";
print <<EndOfHTML
<html>
<body>
<img src="getchart.pl?img=tmp/tmpcharts/$chart1URL" border="0" usemap="#map1">
<map name="map1">
$imageMap
</map>
</body>
</html>
EndOfHTML
;


here is generated image map:<html>
<body>
<img src="getchart.pl?img=tmp/tmpcharts/cd__10.91.20.184109161319756147_0.png" border="0" usemap="#map1">
<map name="map1">
<area shape="rect" coords="646,186,673,190" title='1/5: 0.0'>
<area shape="rect" coords="612,165,639,190" title='1/5: 3.0'>
<area shape="rect" coords="578,141,605,190" title='1/5: 6.0'>
<area shape="rect" coords="518,124,545,190" title='1/4: 8.0'>
<area shape="rect" coords="484,149,511,190" title='1/4: 5.0'>
<area shape="rect" coords="450,165,477,190" title='1/4: 3.0'>
<area shape="rect" coords="390,141,417,190" title='1/3: 6.0'>
<area shape="rect" coords="356,157,383,190" title='1/3: 4.0'>
<area shape="rect" coords="322,186,349,190" title='1/3: 0.0'>
<area shape="rect" coords="262,91,289,190" title='1/2: 12.0'>
<area shape="rect" coords="228,186,255,190" title='1/2: 0.0'>
<area shape="rect" coords="194,182,221,190" title='1/2: 1.0'>
<area shape="rect" coords="134,108,161,190" title='1/1: 10.0'>

<area shape="rect" coords="100,182,127,190" title='1/1: 1.0'>
<area shape="rect" coords="66,174,93,190" title='1/1: 2.0'>
<area shape="rect" coords="646,149,673,190" title='1/5: 5.0'>
<area shape="rect" coords="612,186,639,190" title='1/5: 0.0'>
<area shape="rect" coords="578,186,605,190" title='1/5: 0.0'>
<area shape="rect" coords="518,186,545,190" title='1/4: 0.0'>
<area shape="rect" coords="484,186,511,190" title='1/4: 0.0'>
<area shape="rect" coords="450,186,477,190" title='1/4: 0.0'>
<area shape="rect" coords="390,186,417,190" title='1/3: 0.0'>
<area shape="rect" coords="356,186,383,190" title='1/3: 0.0'>
<area shape="rect" coords="322,165,349,190" title='1/3: 3.0'>
<area shape="rect" coords="262,186,289,190" title='1/2: 0.0'>
<area shape="rect" coords="228,157,255,190" title='1/2: 4.0'>
<area shape="rect" coords="194,186,221,190" title='1/2: 0.0'>
<area shape="rect" coords="134,186,161,190" title='1/1: 0.0'>
<area shape="rect" coords="100,186,127,190" title='1/1: 0.0'>
<area shape="rect" coords="66,186,93,190" title='1/1: 0.0'>

</map>
</body>
</html>

thanks
data1.png

  Re: side bar with html map
Posted by Peter Kwan on Oct-28-2011 16:12
| Reply | Monitor
Hi Haim,

I think if you use $perlchartdir::NoValue to represent the missing bar, it will not have any image map entry.

In your current code, it uses NoValue. It is likely to be undefined in Perl. According to Perl syntax rule, undefined things will be regarded as 0 in numeric context. So in your current code, the missing bar is of value 0, and so there is an image map at y = 0.

Hope this can help.

Regards
Peter Kwan

  Re: side bar with html map
Posted by Haim on Oct-28-2011 23:05
| Reply | Monitor
Excellent
Thanks!