polarPixellate GLSL

I’ve converted the Core Image Filter code from polarPixellate 0.2 into a GLSL Fragment shader.

I’ve noticed you don’t seem to be able to change the order that input ports appear at the left side of a GLSL module, as you now can with macros that have custom input and output ports, which is a bit annoying.

If anyone’s interested, I will post the QTZ file for you to pick apart. Haven’t tested this in VDMX yet, but for the moment, it’s just a test really, and the CIFilter version works just as well.

GLSL code:

Vertex Shader

void main()
//Transform vertex by modelview and projection matrices
gl_Position = gl_ModelViewProjectionMatrix * gl_Vertex;

//Forward current color and texture coordinates after applying texture matrix
gl_FrontColor = gl_Color;
gl_TexCoord[0] = gl_TextureMatrix[0] * gl_MultiTexCoord0;

Fragment Shader:

// Control inputs
uniform float Angle; // range 2pi / 100000.0 to 1.0 (rounded down), exponential
uniform float AngleMin; // range -3.2 to 3.2
uniform float AngleWidth; // range 0.0 to 6.4
uniform float Radius; // range -10000.0 to 1.0
uniform float RadiusMin; // range 0.0 to 2.0
uniform float RadiusWidth; // range 0.0 to 2.0
uniform vec2 Center; // range: -1.0 to 3.0

// Texture input
uniform sampler2D Texture;

void main()
// Normalised texture coords
vec2 texCoord = gl_TexCoord[0].xy;
// Shift origin to texture centre (with offset)
vec2 normCoord;
normCoord.x = 2.0 * texCoord.x – Center.x;
normCoord.y = 2.0 * texCoord.y – Center.y;
// Convert Cartesian to Polar coords
float r = length(normCoord);
float theta = atan(normCoord.y, normCoord.x);

// The actual effect
r = (r < RadiusMin) ? r : (r > RadiusMin + RadiusWidth) ? r : ceil(r / Radius) * Radius;
theta = (theta < AngleMin) ? theta : (theta > AngleMin + AngleWidth) ? theta : floor(theta / Angle) * Angle;

// Convert Polar back to Cartesian coords
normCoord.x = r * cos(theta);
normCoord.y = r * sin(theta);
// Shift origin back to bottom-left (taking offset into account)
texCoord.x = normCoord.x / 2.0 + (Center.x / 2.0);
texCoord.y = normCoord.y / 2.0 + (Center.y / 2.0);

// Output
gl_FragColor = texture2D(Texture, texCoord);

5 Responses to “polarPixellate GLSL”

  1. 1 Cat
    January 7, 2008 at 8:45 pm

    Hey thats pretty cool!
    I’v only just started messing with the leopard version of quartz, got some PC pixel shaders I’ll try and port soon too!

  2. 2 toneburst
    January 8, 2008 at 2:46 pm

    Hiya, good to hear from you!

    Leopard QC is so much better than the Tiger version. There are still a few GUI niggles, but it’s much easier to use than the old one. It looks like they’ve really listened to what people wanted.

    I’m intrigued to know how you get on with converting your shaders. Are they HLSL/DirectX ones, I wonder? I found a load of really nice HLSL pixel and vertex shaders on the VVVV website. I’d love to convert them to GLSL I can use in QC, but I don’t really know where to start. I have a big book on GLSL I’m working my way through, though, so hopefully I’ll be able to tackle them at some point.



  3. 3 toneburst
    January 8, 2008 at 2:53 pm

    Just looked at your website and noticed you mention VVVV, so I’m assuming it is VVVV HLSL pixel shaders you’re going to convert to GLSL.
    I’d love to know how you get on, if this is the case.
    From my limited research, it seems that HLSL and GLSL are quite different in terms of the way they do things and their syntax, though most of the maths and login can of course be carried-over from one language to another.


  4. 4 rqtikk
    February 28, 2009 at 5:29 am

    hi toneburst.

    i couldn’t find the core image filter you wrote had converted to GLSL.

    i’m just a newbie wanting to have a damn spin blur and now i’m trying to write some CI filter that does polar coordinate conversion and then motion blur and then conversion back to cartesian. maybe i’ll use QC’s motion blur and have two filters.

    please send me the sourcecode for this.

    and if it’s only a matter of some minutes for you, i would really appreciate if you could send me two CI kernel snippets for QC, one which does cartesian to polar and the opposite which does polar to cartesian.

    would be great since i guess i would have to spend quite a lot of hours with this and i prefer getting into GLSL/CI or anything deeper than drawing connections between patches in QC at some later time and for now just finish this idea and get back to drawing.

    thanks a lot, i hope you get notified of this message.

    best wishes,

    • 5 toneburst
      February 28, 2009 at 3:17 pm

      Hi rqrikk,

      good to hear from you.
      I got the cartesian polar code from this page:

      One other thing that might be handy:
      CIKernel coordinates are in pixels, whereas GLSL coordinates are normalized to the range 0 > 1, so this snippet scales coords in a CIFilter to 0 > 1

      vec2 dims = samplerSize(image);
      vec2 xyNormalized = samplerCoord(image) / dims;

      Then, after you’ve done and calculations on the coords, you need to multiply by the variable ‘dims’ to transform the coordinates back to the correct range.

      Hope this helps.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s


  • Waiting in the queue to see Art of Noise at the British Library. 1 week ago
December 2007
« Nov   Jan »


Blog Stats

  • 479,405 hits

%d bloggers like this: