Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. QML canvas - Jagged lines
Qt 6.11 is out! See what's new in the release blog

QML canvas - Jagged lines

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
1 Posts 1 Posters 1.1k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • E Offline
    E Offline
    econsysqtdev
    wrote on last edited by
    #1

    I'm using qt quick 2.0 on Linux to a draw around 360 lines within a circle with a difference of 1 degree between them. I observe that the lines are jagged when the interval is 1-10 degrees. I've tried enabling and disabling the anti-aliasing and smooth property. Has any one faced this before or is there any solution I'm missing ? Below is the sample code of the jagged lines. Also, please us the following link to view the screen shot of the jagged lines.link text

    @
    import QtQuick 2.0
    Rectangle {
    width: 400
    height: 400
    Canvas {
    id:canvas
    width: 400
    height: 400
    antialiasing: false
    smooth: true
    onPaint:
    {
    var ctx = canvas.getContext('2d');
    ctx.save()

            // Make canvas all white
            ctx.beginPath();
            ctx.clearRect(0, 0, width, height);
            ctx.fill();
    
            var radius = Math.floor(canvas.width/2);
            ctx.fillStyle = "grey"
            ctx.rect(0,0,width,height)
            ctx.fill();  
            var begin = 0; var interval = 3;
            var arcSize= degreesToRadians(interval);
            var centerx = canvas.width/2
            var centery = canvas.height/2
            for(var startingAngle=begin; startingAngle < 360;)
            {
                ctx.beginPath();
                ctx.moveTo(canvas.width/2, centery);
                context.strokeStyle= "white"
                ctx.lineWidth=1.5;
                ctx.arc(centerx, centery, radius, degreesToRadians(startingAngle), startingAngle + arcSize, false);
                ctx.stroke();
                ctx.closePath();
                startingAngle = startingAngle + interval;
            }
        }
    }
    
    function degreesToRadians(degrees) {
        return (degrees * Math.PI)/180;
    }
    

    }
    @

    Any help is greatly appreciated.

    --Narayanan K

    1 Reply Last reply
    0

    • Login

    • Login or register to search.
    • First post
      Last post
    0
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Get Qt Extensions
    • Unsolved