Steema Central

Posted: **Wed May 18, 2016 8:53 am**

Hello,

please check the following code:

<!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

Posted: **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+")";

Posted: **Thu May 19, 2016 12:04 pm**

Hello,

thanks for the explanation, it works fine now.

Best regards,
MS

Steema Central

Bar Transparency

Bar Transparency

Re: Bar Transparency

Re: Bar Transparency