ChartDirector High Rez PolarChartMBS transparency

Hello – hopefully Christian will catch this or some other expert. I decided to start a new thread. I’ve been having trouble with transparency turning the background black rather than pick up window background. I’ve commented out some of the code for the High Resolution PolarZones example to show everyone what I am getting when I try this form my weather app. Here is the code:

  const f=1 // scale factor, 1 for screen and 4 or more for printing
  // The data for the chart
  dim data(-1) as double = array(51, 15, 51, 40, 17, 87, 94, 21, 35, 88, 50, 60.0)
  // The labels for the chart
  dim labels(-1) as string = array("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sept", "Oct", "Nov", "Dec")
  // Create a PolarChart object of size 400 x 420 pixels
  dim c as new CDPolarChartMBS(f*400, f*420, CDPolarChartMBS.kTransparent)
  call c.angularAxis.setLabelStyle "",8*f
// Took these two patterns out of the chart to illustrate what I am seeing  not exact, but close enough
 // Set background color to a 2 pixel pattern color, with a black border and 1  
  // pixel 3D border effect
  'dim pattern1(1) as integer
  'c.setBackground(c.patternColor(pattern1, 2), 0, 1)
  // Add a title to the chart using 16 pts Arial Bold Italic font. The title text
  // is white (&hffffff) on 2 pixel pattern background
  'dim pattern2(1) as integer 
  'c.addTitle("Chemical Concentration", "arialbi.ttf", f*16, &hffffff)'.setBackground(c.patternColor(pattern2, f*2))
  // Set center of plot area at (200, 240) with radius 145 pixels. Set background
  // color to blue (9999ff)
  c.setPlotArea(f*200, f*240, f*145, &h9999ff)
  // Color the region between radius = 40 to 80 as green (99ff99)
  c.radialAxis.addZone(40, 80, &h99ff99)
  // Color the region with radius > 80 as red (ff9999)
  c.radialAxis.addZone(80, 999, &hff9999)
  c.radialAxis.setLinearScale 0, 100,20
  // Set the grid style to circular grid
  // Set the radial axis label format
  c.radialAxis.setLabelFormat("{value} ppm")
  // Use semi-transparent (40ffffff) label background so as not to block the data
  'c.radialAxis.setLabelStyle.setBackground(&h40ffffff, &h40000000)
  // Add a legend box at (200, 30) top center aligned, using 9 pts Arial Bold font.
  // with a black border.
  dim LegendBox as CDLegendBoxMBS
  legendBox = c.addLegend(f*200, f*30, false, "arialbd.ttf", f*9)
  // Add legend keys to represent the red/green/blue zones
  legendBox.addKey("Under-Absorp", &h9999ff)
  legendBox.addKey("Normal", &h99ff99)
  legendBox.addKey("Over-Absorp", &hff9999)
  // Add a blue (000080) spline line layer with line width set to 3 pixels and
  // using yellow (ffff00) circles to represent the data points
  dim layer as CDPolarSplineLineLayerMBS
  layer = c.addSplineLineLayer(data, &h000080)
  layer.setDataSymbol(CDPolarChartMBS.kCircleShape, f*11, &hffff00)
  // Set the labels to the angular axis as spokes.
  call c.angularAxis.setLabels(labels)
  call c.radialAxis.setLabelStyle "",8*f
  c.angularAxis.setLabelGap f*8
  // Output the chart

Other than the mods above the code from the polarzones example is the same. In this example the background color is white. Shouldn’t the black “transparent” area show white?

In my app the background is a photo of the sky. I’m trying to get the control (canvas in this case) to paint the polarchart with a transparent background and show th sky. If I can sort it out with the high resolution polarzones example I can sort it out for my app.

Appreciate any help

you need to use
dim c as new CDPolarChartMBS(f400, f420, CDPolarChartMBS.kTransparent)

and disable below the call to setBackground.

Christian – I believe I did that, unless I am missing one of the “setBackground” calls …


Hmmm – does anybody get a black background when you cut and past the above code in the open event for the picwindow in the polarzones high resolution example?

I’ve disabled most of the “setBackground” calls to see the transparent effect. I get a black background for the outer zones as well as the areas where you see the spoke labels and the legend at the top.


// Output the chart
dim pngData as string = c.makeChart(c.kPNG)
Backdrop = PNGStringToPictureMBS(pngData)

did you use this?

Thanks Christian – did not know about that. It works great. Really appreciate the help.