Masking a Column2DChart

[nthibert]

Hello,

 

 

 

I have a chart that needs to be masked. What is happening is that the mask is making the chart text disappear(because it's dynamic). I have did what the website said to put a text field on stage that embeds the Verdana font. But this does not fix the problem. I'm using the Column2DChart in Flash 8 AS2. Anybody have any ideas or solution about this issue.

 

 

 

Thanks

 

 

 

Nathan

[jmarkus]

Same problem here, whenever I place a mask over a line graph, the mask does not mask it and shows like a normal layer shape

 

 

 

 

var xmlData2:XML = new XML();

 

xmlData2.onLoad = function(success) {

 

renderChartZ(xmlData2);

 

};

 

xmlData2.load("zoom/data.xml");

 

 

 

function renderChartZ(xmlData2) {

 

var chartContainerMCZ:MovieClip = this.createEmptyMovieClip("ChartHolderZ", 3);

 

var ChartZoom:Line2DChart = new Line2DChart(chartContainerMCZ, 3, 450, 200, 783, 150, false, "EN", "noScale");

 

ChartZoom.setXMLData(xmlData2);

 

ChartZoom.render();

 

}

 

 

 

var mask_mc = this.createEmptyMovieClip("cmask", 5);

 

var r:Number = 100;

 

var x:Number = 850;

 

var y:Number = 200;

 

var A:Number = Math.tan(22.5*Math.PI/180);

 

var endx:Number;

 

var endy:Number;

 

var cmaskx:Number;

 

var cmasky:Number;

 

 

 

cmask.beginGradientFill("radial",[0x000000, 0x000000],[80, 100],[128, 255],{matrixType:"box", x:0, y:0, w:430, h:150, r:0});

 

cmask.moveTo(x+r,y);

 

for (var angle:Number = 45; angle<=360; angle += 45) {

 

endx = r*Math.cos(angle*Math.PI/180);

 

endy = r*Math.sin(angle*Math.PI/180);

 

cmaskx = endx+r*A*Math.cos((angle-90)*Math.PI/180);

 

cmasky = endy+r*A*Math.sin((angle-90)*Math.PI/180);

 

cmask.curveTo(cmaskx+x,cmasky+y,endx+x,endy+y);

 

}

 

cmask.endFill();

 

 

 

chartContainerMCZ.setMask(mask_mc);

 

mask_mc.newx = 300;

 

mask_mc.speed = 2;

 

 

 

mask_mc.onEnterFrame = function() {

 

this._x += (this.newx-this._x)/this.speed;

 

};

[Guest Basundhara Ghosal]

Hi,

Currently our development team is looking into the issue.

We will get back to you as soon as possible.

[Guest Basundhara Ghosal]

Hi,

As, none of the textfields in the chart are having text embed. So, you need to take up the task of embedding text in the dynamic textfields within the chart, to achieve the required result.

The following is a working code, that we have tried as an work-around.

Here, the texts are getting masked, but only by the bounding rectangle of the circle!

You may expect further solution on this, while it seems to be a feature of flash.

 

Ref.-

 

import com.fusioncharts.core.charts.Line2DChart;

var xmlData2:XML = new XML();

xmlData2.onLoad = function(success) {

renderChartZ(xmlData2);

};

xmlData2.load("data.xml");

function renderChartZ(xmlData2) {

var chartContainerMCZ:MovieClip = this.createEmptyMovieClip("ChartHolderZ", 3);

var ChartZoom:Line2DChart = new Line2DChart(chartContainerMCZ, 3, 450, 350, 0, 0, false, "EN", "noScale");

ChartZoom.setXMLData(xmlData2);

ChartZoom.render();

 

chartContainerMCZ.setMask(mask_mc);

}

var mask_mc = this.createEmptyMovieClip("cmask", 5);

var r:Number = 100;

var x:Number = 100;

var y:Number = 100;

var A:Number = Math.tan(22.5*Math.PI/180);

var endx:Number;

var endy:Number;

var cmaskx:Number;

var cmasky:Number;

cmask.beginGradientFill("radial",[0x000000, 0x000000],[80, 100],[128, 255],{matrixType:"box", x:0, y:0, w:430, h:150, r:0});

cmask.moveTo(x+r,y);

for (var angle:Number = 45; angle<=360; angle += 45) {

endx = r*Math.cos(angle*Math.PI/180);

endy = r*Math.sin(angle*Math.PI/180);

cmaskx = endx+r*A*Math.cos((angle-90)*Math.PI/180);

cmasky = endy+r*A*Math.sin((angle-90)*Math.PI/180);

cmask.curveTo(cmaskx+x,cmasky+y,endx+x,endy+y);

}

cmask.endFill();

 

mask_mc.newx = 200;

mask_mc.speed = 2;

mask_mc.onEnterFrame = function() {

this._x += (this.newx-this._x)/this.speed;

};

Hope this helps.