Soundcloud soundwave

Question

I am trying to generate soundwave which would look like the one that soundcloud have.

But i can't figure out how do they make their soundwaves so clear, for example this is an example of soundcloud and my generated soundwave:

I am using to php to read wav file and generate the image, but if there is some better library in any language which would do this better i would definitely like to to hear about it.

I have pasted the class that I'm usin in Pastebin.

I got this code from andrewfreiday.com and modified to fit my website.

I'm really lost at this and any kind of suggestion would help a lot.

Answer 1

The waveforms on soundcloud.com are drawn with canvas -- whereas in your sample image, it appears as though it's a larger image which is scaled down to the desired size. When you do this scaling in the browser, it will anti-alias the 'half' pixels. When drawing to the canvas, we draw exactly the pixels needed at the exact resolution needed. This means there's no image scaling and no blurriness.