Performance when scrolling very wide Shapes

[pulse00]

Hi,

i'm trying to visualize the waveform of mp3 files, which i've already accomplished. The only thing i'm struggling right now is performance.

I'm dealing with quite large soundfiles, so the visualized waveform
needs to be scrollable.

My first approach was loading the audiodata into an array, and only draw
the parts that need to be visible in the viewport.

However, as the waveform needs to scroll through the viewport as the mp3 is playing, this was hitting the cpu real hard cause the visible part of the waveform needs to be rendered every 10-20 ms or so.

That's why i thought i simply draw the whole waveform once, and use the scrollRect property of the Shape object for scrolling, which i implemented like this:


wave.graphics.clear();
wave.graphics.lineStyle(1,0x000000,1);
wave.cacheAsBitmap = true;
wave.scrollRect = new Rectangle(0,0,this.parent.width, 180);

var x : Number = 0;

while (x < data.length) {

wave.graphics.moveTo(x,middle);
wave.graphics.lineTo(x, middle-(data[x]*middle) );
wave.graphics.moveTo(x, middle);
wave.graphics.lineTo(x, data[x]*middle+middle);
x++;

}

When i scroll through the waveform using this code, the cpu is hitting the 100%.

The width of the shape in my testcase is 9200 pixels.

Is this possibly to big, hence the bad performance ?


thanks for your help !