Search the Community

Showing results for tags 'stroke'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Web Gaming Platform
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 5 results

  1. Hi there folks! It's been a while since I posted something in here, glad to be back! I have a fair amount of experience in game development using JS Canvas, but recently I decided I had move on - so I went with Pixi. I figured out the basics of how to add sprites, do filters and such, but I just can't seem to figure out how to do simple lines and then manipulate them afterwards. What I mean is something like this: I noticed that PIXI.Graphics has an object attached to it called "graphicsData" in which I can find the points that make up the line - great - but when changing the value of these variables, nothing happens to the appearance of my line. I'd appreciate any help, as I'm quite new to Pixi Thank you!
  2. Is it possible to use a "stroke" as a mask?
  3. Is there any way to use opacity of stroke in Phaser? Like we can apply these features on Phaser.Text let style = { font: "Arial", fill: "white", stroke: "#000000", strokeThickness: "16", fontSize: "24px" }; But how to add opacity to stroke, something like strokeOpacity?
  4. colonel315

    Line Stroke

    I have created a coordinate grid and am now trying to create the origin lines for the x and y axis, but there seems to be no way to increase the stroke of a line to make it thicker. Is there a way to do this?
  5. Hello, I have created a line to immitate lightning as shown in the this is my code that creates the line var ctx = reg.lightningBitmap.context; var width = reg.lightningBitmap.width; var height = reg.lightningBitmap.height; // Our lightning will be made up of several line segments starting at // the center of the top edge of the bitmap and ending at the bottom edge // of the bitmap. // Clear the canvas ctx.clearRect(0, 0, width, height); ctx.lineCap = "round"; ctx.lineJoin = "mitter"; // Set the starting position and number of line segments var x = 0; var y = 0; var segments = game.rnd.integerInRange(20, 100); // Draw each of the segments for (var i = 0; i < segments; i++) { // Set the lightning color and bolt width ctx.strokeStyle = 'rgb(0, 174, 239)'; ctx.fillStyle = 'rgb(255,255,255)'; ctx.lineWidth = 3; ctx.beginPath(); ctx.moveTo(x, y); // Calculate an x offset from the end of the last line segment and // keep it within the bounds of the bitmap y += game.rnd.integerInRange(-50, 50); if (y <= 10) y = 10; if (y >= width - 10) y = width - 10; // Calculate a y offset from the end of the last line segment. // When we've reached the ground or there are no more segments left, // set the y position to the height of the bitmap. x += game.rnd.integerInRange(20, width / segments); if (i == segments - 1 || x > width) { x = width; } // Draw the line segment ctx.lineTo(x, y); ctx.stroke(); // Quit when we've reached the ground if (x >= width) break; } // This just tells the engine it should update the texture cache reg.lightningBitmap.dirty = true;Now what I want to achieve is to have a white fill for the line and blue stroke as it is. How could I achieve this? Thanks guys.