标签: canvas

我正在开发一个在 JFrame 上使用 Canvas 的 java gui 应用程序。我尝试在 Jframe 上绘制细矩形，并注意到它们并不总是显示相同的宽度。

这是我写的测试类的结果。左侧使用fillRect()绘制，宽度为1，右侧使用drawLine绘制。

这是我的测试类的代码。

import javax.swing.*;
import java.awt.*;
import java.awt.image.BufferStrategy;

public class test {
    public static void main(String[]args){
        new test();
    }

    public test(){
        JWindow frame = new JWindow();
        frame.setSize(500,500);
        frame.setLocation(200,200);

        Canvas c = new Canvas();
        frame.add(c);

        frame.setVisible(true);

        new Thread(() -> {
            while(true) {
                BufferStrategy bs = c.getBufferStrategy();

                if (bs == null) {
                    c.createBufferStrategy(2);
                    bs = c.getBufferStrategy();
                }

                Graphics g = bs.getDrawGraphics();
                Graphics2D g2 = (Graphics2D) g;

                g2.setColor(Color.black);

                for(int i = 0; i …

我正在尝试创建一个可以放置在我的应用程序中的画布组件。

最终我会做到这一点，以便用户可以在上面绘图。

错误在这一行：

const context = canvas.getContext("2d");

对象可能为“空”

如果我把它改成：

const context = canvas?.getContext("2d");

我得到：

属性“getContext”在类型“never”上不存在

这是该组件的完整代码：

const Canvas = (props: CanvasProps) => {
  const canvasRef = useRef(null);

  useEffect(() => {
    const canvas = canvasRef.current;
    const context = canvas.getContext("2d");
    //Our first draw
    context.fillStyle = "#000000";
    context.fillRect(0, 0, context.canvas.width, context.canvas.height);
  }, []);

  return <canvas ref={canvasRef} {...props} />;
};

export default Canvas;

我试图找到一种方法使R的3D PCA可视化更加便携; 我在2D矩阵上运行PCA prcomp().

1. 如何导出数据点的3D坐标以及与每个坐标相关联的标签和颜色(RGB)？
2. 什么是princomp()和prcomp()？的实际区别？
3. 有关如何使用HTML5和画布最佳地查看3D PCA图的任何想法？

谢谢!

我试图了解人们使用画布的原因？

我在工作发布中看到它,我在Definitive JavaScript中读到它,但我不太了解它的用途.

我知道您可以绘制2d或3d(通常是2d)对象,但为什么不使用Gimp或Photoshop并上传图像.

是这样你可以根据说...用户特定的数据创建动态图像？

什么是实际示例,或者可能是画布专业实现的链接(Definite JavaScript显示基础内容,如绘制圆圈).

MDN教程

如何在imageview上添加阴影效果,就像这个shreen shot一样

如何添加这种类型的3D效果我imageview任何想法????

<ImageView
     android:id="@+id/test_button_image"
     android:layout_width="fill_parent"
     android:layout_height="200dp"
     android:scaleType="fitXY"
     android:background="@drawable/border6"
     android:src="@drawable/ic_launcher" >
</ImageView>

我试图循环遍历canvas方法返回的数组:getImageData()返回绘制到HTML画布的图像的像素颜色值.但我杀了我的浏览器,返回的数组对于平均大小的图像当然很大,我使用错误的方法还是循环通过如此大的数组只是不可能？

for (var i = 0; i < ImageData.length; i + 3) {
    if (ImageData[i] > 210 && ImageData[i + 1] < 200 && ImageData[i + 2] > 60) {
        var Suspect = {
            Red: ImageData[i],
            Green: ImageData[i + 2],
            Blue: ImageData[i + 3]
        }
        Suspects.push(Suspect);
    }
}

可能有人知道用于画布绘制的良好JavaScript库或框架。

我有以下问题：

1）徒手画一些线（如Paint/Photoshop铅笔）

2）需要将线转换为“矩形蛇”（使用固定宽度的矩形构建线）

看截图

对于这个问题，使用什么样的库会更好？可能某种库已经具有此功能？

我的意思是需要以下功能：

• 线近似

• 样条分离

• 将线转换为多边形/形状/对象

如果有人能帮助我，那就太好了。谢谢！

我想绘制一个具有环形形状的游戏地图（10000x10000）的边缘（因此该地图将是圆形的）。最简单（但性能最差）的方法是绘制一个实心圆（半径为6000）和一个实心圆（半径为5000）。

播放器的视口很小，因此不必绘制整个环形。一个部门很好。

我尝试使用ctx.arc，但是它给了我一个和弦...

有没有一种有效的方法可以在canvas2D上绘制巨大的环形扇区？

我正在使用CanvasJS并且总是在这里使用这些行:

var chart = new CanvasJS.Chart("chartContainer",
   {
    ...
    });
    chart.render();

不幸的是,我不知道这些线路在做什么.有人可以向我解释一下吗？非常感谢你!

我有画布元素（我使用 Fabric.JS）。在画布下方的屏幕上有 Dom textarea。

我有下载按钮，它可以工作 - 它将canvas元素下载为图像。但是，我还需要将文本中的textarea文本添加到此下载图像中。它应该在下面canvas。

这应该怎么做？我不知道如何实现这个技巧？

代码（它是 typescript 并在 React 应用程序中使用，但我猜在这里无关紧要，因为如果它是纯 Javascript 想法将是相同的 - 创建虚拟元素并触发点击）

const url = canvas.toDataURL({
      format: "png",
      width,
      height,
    });
    const a = document.createElement("a");
    a.href = url;
    a.download = "download";
    const clickHandler = () => {
      setTimeout(() => {
        URL.revokeObjectURL(url);
        a.removeEventListener("click", clickHandler);
        a.remove();
      }, 150);
    };
    a.addEventListener("click", clickHandler, false);
    a.click();