canvas.getContext('2d');

[Gyldstrand]

I see this referenced in everything:

var canvas = document.getElementById('mycanvas');
var ctx = canvas.getContext('2d');

How do I access these with PIXI?

Is it  renderPIXI.gl.canvas and renderPIXI.gl.canvas.getContext?

[ivan.popelyshev]

var renderer = PIXI.autoDetectRenderer(800, 600);
var canvas = renderer.view;
var ctx = renderer.context;

Though I dont know how can you use "ctx" for anything, renderer.render(stage) will completely wipe the canvas and do its job.

[Gyldstrand]

  var canvas = document.getElementById("demo1");
  var ctx = canvas.getContext("2d");

  var light = new Lamp({
    position: new Vec2(200, 150),
    distance: 200
  });
  var disc = new DiscObject({ 
    center: new Vec2(100, 100), 
    radius: 30 
  });
  var rect = new RectangleObject({ 
    topleft: new Vec2(250, 200), 
    bottomright: new Vec2(350, 250) 
  });

  var lighting = new Lighting({
    light: light,
    objects: [ disc, rect ]
  });
  lighting.compute(canvas.width, canvas.height);
  ctx.fillStyle = "black";
  ctx.fillRect(0, 0, canvas.width, canvas.height);
  lighting.render(ctx);

Trying to test out http://greweb.me/illuminated.js/gettingstarted.html but I get errors about the ctx. I tried the renderer.context but nothing changed. Is this something that needs to be rewired for PIXI or is there a simple replacement for the reference?

[ivan.popelyshev]

You have to create off-screen canvas and use Texture.fromCanvas to convert it to texture that PIXI can use.

[caymanbruce]

On 1/18/2016 at 10:16 AM, ivan.popelyshev said:

var renderer = PIXI.autoDetectRenderer(800, 600);
var canvas = renderer.view;
var ctx = renderer.context;

Though I dont know how can you use "ctx" for anything, renderer.render(stage) will completely wipe the canvas and do its job.

How about drawing shadowBlur for Canvas objects? I don't know how to do that in PIXI.js.