Bar Transparency

TeeChart for JavaScript for the HTML5 Canvas
Post Reply
Microsolutions
Newbie
Newbie
Posts: 10
Joined: Tue May 10, 2016 12:00 am

Bar Transparency

Post by Microsolutions » Wed May 18, 2016 8:53 am

Hello,

please check the following code:

Code: Select all

<!DOCTYPE html>
<head>
<title>Bar Transparency</title>
<script type="text/javascript" src="https://www.steema.com/files/public/teechart/html5/latest/src/teechart.js"></script>
<script type="text/javascript">
function draw() {
  var Chart1=new Tee.Chart("Canvas1");
  Chart1.title.text="Bar Transparency";
  var Series1=Chart1.addSeries(new Tee.Bar());
  Series1.colorEach="no";
  Series1.format.fill="rgba(243,156,53,0.05)";
  Series1.data.values=[10,5];
  Series1.data.x=[1,2];
  Series1.marks.visible=true;
  Series1.format.gradient.visible=false;
  Chart1.draw();
}
</script>
</HEAD>
<BODY onload="draw()">
<canvas id="Canvas1" width="800" height="600">
This browser does not seem to support HTML5 Canvas.
</canvas>
</BODY>
</HTML>
The bar borders and the marks do not apply the transparency. Check it, please.

Thanks in advance and best regards,
MS

Yeray
Site Admin
Site Admin
Posts: 9514
Joined: Tue Dec 05, 2006 12:00 am
Location: Girona, Catalonia
Contact:

Re: Bar Transparency

Post by Yeray » Thu May 19, 2016 9:13 am

Hello,
Microsolutions wrote:The bar borders and the marks do not apply the transparency. Check it, please.
There are different properties for the series brush (format.fill), the series pen (format.stroke.fill), marks (marks.format.fill) and marks shadow (marks.format.shadow.color). Ie:

Code: Select all

            var transp = 0.5;
            Series1.format.fill="rgba(243,156,53,"+transp+")";
            Series1.format.stroke.fill="rgba(0,0,0,"+transp+")";
            Series1.marks.format.fill = "rgba(245,245,220,"+transp+")";
            Series1.marks.format.shadow.color="rgba(80,80,80,"+transp+")";
Best Regards,
ImageYeray Alonso
Development & Support
Steema Software
Av. Montilivi 33, 17003 Girona, Catalonia (SP)
Image Image Image Image Image Image Please read our Bug Fixing Policy

Microsolutions
Newbie
Newbie
Posts: 10
Joined: Tue May 10, 2016 12:00 am

Re: Bar Transparency

Post by Microsolutions » Thu May 19, 2016 12:04 pm

Hello,

thanks for the explanation, it works fine now.

Best regards,
MS

Post Reply