robmyers

Members
  • Content Count

    10
  • Joined

  • Last visited

  1. If you want to test whether the bounding rectangles of two PIXI.Sprite's overlap you can use: hitTest(s1.position.x, s1.position.y, s1.width, s1.height, s2.position.x, s2.position.y, s2.width, s2.height);where s1 and s2 are the two sprites, and: hitTest = function(x1, y1, w1, h1, x2, y2, w2, h2){ if (x1 + w1 > x2) if (x1 < x2 + w2) if (y1 + h1 > y2) if (y1 < y2 + h2) return true; return false;};If you need a more complicated hitTest e.g. whether two convex polygons overlap, then I use Box2D for that.
  2. I don't think the drawImage in .renderDisplayObject should be changed. Forcing integer values for the initial draw position could lead to jerky animation e.g. when a sprite it moved across the screen. It's better to take advantage of the inbuilt anti-aliasing for non-integer valued pixel positions. Perhaps you could instead test whether "(displayObject.anchor.x) * -frame.width" is not an integer (similarly for height), and incrementally change the anchor so that it is?
  3. You could try manually creating a PIXI.Sprite containing the text, and fiddle with the parameters to see what's going wrong. 1. Draw the text directly into a canvas element canvasElem. var canvasElem = document.createElement("canvas"); var ctx = canvasElem.getContext("2d"); // I fix the width/height, but you can also compute it from the input string canvasElem.width = 100; canvasElem.height = 50; // e.g. "20pt Arial" ctx.font = "your font's name"; // default values ctx.fillStyle = "black"; ctx.strokeStyle = "black"; ctx.lineWidth = 0; // pixi default, although usual default is "alphabetic" ctx.textBaseline = "top"; // pixi default, although usual is "start" ctx.textAlign = "left"; // draw the text // the coordinates specify where to start drawing from ctx.fillText("your text here",0,0); // optionally, draw text outline too // by default pixi doesn't do this ctx.strokeText("your text here",0,0); 2. Load it into a PIXI.Texture and use it to create a PIXI.Sprite. var texture = PIXI.Texture.fromCanvas(canvasElem); var sprite = new PIXI.Sprite(texture); Then you can add the sprite to the stage, or wherever.
  4. Hey, I'm currently making an isometric game using PIXI for rendering / organisation. It has been a great help! Behind the scenes I have a 3d engine (I'm not using WebGL), so that bots and geometry are imported via OBJ files. It also uses Box2d for collision detection + other physics. Everything is pre-rendered e.g. the weird vehicle in the screenshots is rendered at 180 different angles. The vehicle is itself built of many different MovieClips, so it can be animated it various ways. It runs pretty damn fast, using the CanvasRenderer. Anyway, just thought I'd let you know, even though it's early days. and another angle: Cheers, Rob
  5. Ah well, maybe I was right. It seems that in Chrome I need "Override Rendering List" enabled for PIXI to detect WebGL, which means my configuration is unsupported. I was never seeing any errors with the canvas renderer, so I guess this problem is solved.
  6. Sadly not. The errors change dependent upon whether antialiasing is on, and even then the lines aren't rendered properly (see the first two diagrams above, I have no control over the red lines). It might be because I'm using a 2008 Mac, which possibly has dodgy webgl drivers, although I'm reaching here. Anyway, thanks for the suggestion.
  7. Perhaps I misunderstood, but it looks like you are clearing after you draw... rather than before you draw. If you clear after, then you are wiping all the drawings before you even render. Suppose you want to draw inside the graphics instance every frame, clearing the previous drawing. Then you would repeatedly call a function like: function draw(){ // clear all drawing from graphics graphics.clear(); // draw some stuff graphics.beginFill(0x000000); // etc. } Also, make sure graphics has been added as a child of the stage (or similar).
  8. Hi, I include three pictures. For the first two I am using the WebGLRenderer. 1. I use lineStyle and close each polygon (I get "Shape too complex..." errors): 2. I use lineStyle and I do *not* close each polygon (I get no errors): Note that one edge of each polygon is not drawn in red. 3. Finally, if I use the CanvasRenderer then I get the best image (and no errors), whether or not I close each polygon. Thanks a lot for your help.
  9. I don't think there is anything wrong with the code... I say this because it works fine when I don't use lineStyle. Anyway, here is the function which draws the polygons. g = the single PIXI.Graphics instance used to draw all the polygons. camera = an object I'm using to project 3d points, which take the form this[0], this[1], ... render : function(g,camera){ var i, proj; g.beginFill(0x000000); //g.lineStyle(0.1, 0xFF0000, 1); proj = camera.project3d(this[0]); g.moveTo(proj.x,proj.y); for(i = 1; i < this.length; i++){ proj = camera.project3d(this[i]); g.lineTo(proj.x,proj.y); } //proj = camera.project3d(this[0]); //g.lineTo(proj.x,proj.y); g.endFill(); },If I uncomment "g.lineStyle(0.1, 0xFF0000, 1);" then I get polygons with red borders on 3 of the 4 sides (as expected). However, if I also uncomment the other two lines, so that I am completing the polygon, then I sometimes get the error "Shape too complex to fill". Perhaps this happens because I am drawing many polygons adjacent to each other? Cheers, Rob
  10. Hi, First of all, thanks for the great library! I'm using the WebGLRenderer and I am rendering a number of polygons (actually convex 4-gons) into a single PIXI.Graphics instance. They are adjacent to each other, and I'm receiving the error "Shape too complex to fill" -- unsurprisingly certain polygons aren't getting filled. If I don't use a lineStyle then the error goes away. Also, if I use a lineStyle but don't connect back to the initial point (for each polygon), again the error goes away, although now I'm missing a line. Although I haven't tried it, I suspect the problem should also go away if I use multiple PIXI.Graphics instances. However, this will mean a lot of instances (which are also continually changing)... and will probably effect performance (?). Is there any way around this? Many thanks, Rob