标签: drawing

我正在编写一个HTML5画布绘图应用程序,我需要能够判断在mousemove事件期间是否按下了鼠标左键.在Chrome上,这可行:

if (event.which == 1) { <do stuff> }

但是在FireFox中,无论是否按下按钮,event.which 总是为1.

如何在mousemove事件期间检测鼠标按键是否被按下？

什么我专门拼杀是不是图的只是布局,但是当用户选择一个图节点,并开始拖动它在屏幕方面,该行必须不断被重绘,以反映它会是什么样子,如果在用户是要释放节点.我想这是布局算法的一部分？

另外一些应用程序有点花哨,并不是简单地以良好的弯曲方式绘制线条,而是以几乎直角弯曲方形节点周围的线条.请参阅附图,请记住,当拖动一个节点时,该线被绘制为行进的蚂蚁,并在保留其弯曲样式的同时重新排列.

alt text http://img260.imageshack.us/img260/5458/nodesr.png

可以请别人解释我(ASCII是真的欢迎)什么stride说法代表在Canvas.drawBitmap()和Bitmap.setPixels()/getPixels()？我理解这是跳过colors数组中元素的一种方法,但是如何？

我有一个使用html5画布的绘图应用程序.当用户绘图并且笔滑出画布区域时,chrome会以亮蓝色或黄色突出显示页面上的html元素.

这对绘图体验具有破坏性.有没有办法防止这种亮点发生？

事件处理和绘图代码基于这篇文章:http://jsfiddle.net/rnNFB/1/

var x ;
var y ;

var lower = $('#lower').get(0).getContext('2d') ;
var upper = $('#upper').get(0).getContext('2d') ;

var dragging = false ;

function drawStroke(ctx){
    var i ;
    ctx.strokeStyle='rgba(0,0,0,0.5)' ;
    ctx.lineWidth=10 ;
    ctx.beginPath() ;
    ctx.moveTo(x[0],y[0]) ;
    for (i=1; i < x.length; i++){
        ctx.lineTo(x[i],y[i]) ;
    }
    ctx.stroke() ;
}

$('#upper').mousedown(function(e){
    x=[e.layerX];
    y=[e.layerY];
    dragging=true}) ;

$('#upper').mousemove(function(e){
    if (dragging){
        x.push(e.layerX);
        y.push(e.layerY);
        upper.clearRect(0,0,upper.canvas.width,upper.canvas.height) ;
        drawStroke(upper) ;
    }}) ;

$('#upper').mouseup(function(e){
    dragging = false ;
    upper.clearRect(0,0,upper.canvas.width,upper.canvas.height) ;
    drawStroke(lower) ;
}) ;

如果在画布标签上方添加一些h1标签然后在画布上绘制,在边界框外拖动,您将看到蓝色突出显示.有没有办法防止这种行为？

我正在尝试使用python接口绘制一个多边形来打开opencv,cv2.我创建了一个空图像,只是一个640x480的numpy数组.我有一个我想要在图像上绘制的多边形(四点四边形)列表,但是,我似乎无法使合成器正确指示cv2四边形应该在哪里,并且我不断收到此错误:

OpenCV Error: Assertion failed (points.checkVector(2, CV_32S) >= 0) in fillConvexPoly, file .../OpenCV-2.4.0/modules/core/src/drawing.cpp, line 2017

我的代码基本上包括以下内容:

binary_image = np.zeros(image.shape,dtype='int8')
for rect in expected:
    print(np.array(rect['boundary']))
    cv2.fillConvexPoly(binary_image, np.array(rect['boundary']), 255)
fig = pyplot.figure(figsize=(16, 14))
ax = fig.add_subplot(111)
ax.imshow(binary_image)
pyplot.show()

我的预期rects列表中的'boundary'包含(x,y)点列表的值.代码打印:

[[ 91 233]
 [419 227]
 [410 324]
 [ 94 349]]

我认为这是多边形的点列表,但显然该列表无效points.checkvector,无论是什么.谷歌搜索该错误没有任何用处.

我正在尝试将画布绘制操作剪切成弧形楔形.但是,在将剪切路径设置为画布后,我没有得到预期的结果.

为了说明,这是我正在做的事情:

path.reset();

//Move to point #1
path.moveTo(rect.centerX(), rect.centerY());

//Per the documentation, this will draw a connecting line from the current
//position to the starting position of the arc (at 0 degrees), add the arc
//and my current position now lies at #2.
path.arcTo(rect, 0, -30);

//This should then close the path, finishing back at the center point (#3)
path.close();

这是有效的,当我简单地绘制这个路径(canvas.drawPath(path, paint))时,它会绘制如上所示的楔形.但是,当我将此路径设置为画布的剪切路径并将其绘制到其中时:

//I've tried it with and without the Region.Op parameter
canvas.clipPath(path, Region.Op.REPLACE);
canvas.drawColor(Color.BLUE);

我得到以下结果(仅留下楔形以显示参考):

所以它似乎剪切到了它的边界矩形Path,而不是它 …

我有这个代码绘制一个矩形(我试图重新制作MS Paint)

 case "Rectangle":
               if (tempDraw != null)
                {
                    tempDraw = (Bitmap)snapshot.Clone();
                    Graphics g = Graphics.FromImage(tempDraw);
                    Pen myPen = new Pen(foreColor, lineWidth);
                    g.DrawRectangle(myPen, x1, y1, x2-x1, y2-y1);
                    myPen.Dispose();
                    e.Graphics.DrawImageUnscaled(tempDraw, 0, 0);
                    g.Dispose();
                }

但是,如果我想绘制一个圆圈,会发生什么变化呢？

g.DrawRectangle(myPen, x1, y1, x2-x1, y2-y1);

如何在画布上绘制虚线.我已经尝试过了:

Paint dashPaint = new Paint();
dashPaint.setARGB(255, 0, 0, 0);
dashPaint.setStyle(Paint.Style.STROKE);
dashPaint.setPathEffect(new DashPathEffect(new float[]{5, 10, 15, 20}, 0));
canvas.drawLine(0, canvas.getHeight() / 2, canvas.getWidth(), canvas.getHeight() / 2, dashPaint);

它给了我一条简短的线条,而不是一条线条.

我尝试在我的iOS SpriteKit项目中绘制一个圆,但圆的边缘不平滑.我希望有一个很好的绘制圆圈,因为我会用Photoshop(抗锯齿)绘制它.我发现了几个类似的问题,但问题仍然存在.

-(id)initWithSize:(CGSize)size
{
    if (self = [super initWithSize:size])
    {
        self.backgroundColor = [SKColor whiteColor];
        self.scaleMode = SKSceneScaleModeAspectFill;
        self.size = CGSizeMake(640, 1136);

        CGRect circle = CGRectMake(100.0, 100.0, 80.0, 80.0);
        SKShapeNode *shapeNode = [[SKShapeNode alloc] init];
        shapeNode.path = [UIBezierPath bezierPathWithOvalInRect:circle].CGPath;
        shapeNode.fillColor = [SKColor redColor];
        shapeNode.lineWidth = 0;
        [self addChild:shapeNode];
    }
    return self;
}

这里的诀窍是什么？

是否有一种功能或其他方式可以使用鼠标在Shiny中实现徒手绘制(即绘制随机形状/大小)？

具体来说,我希望能够renderPlot通过以各种(但非均匀)方式标记它来与图形"交互" . - 换句话说,我希望能够标记已经存在的图形.

我的功能缺点已经发现包括:

1. 绘制点,线,矩形或圆形的工具对我来说不够灵活.
2. 工具并不总是与click_plot交互类型的设置兼容.