如何在画布上绘制圆的下半部分

2024-04-04

我正在尝试使用适当的 x=cos(theta)、y=sin(theta) 函数绘制圆的下半部分。如果我将 theta 从 Math.PI 迭代到 2*Math.PI 我似乎得到了圆的上半部分:

我在这段代码片段中做错了什么:

    window.onload = function() 
    {
        var canvas = document.getElementById('circle-canvas');

        if (canvas && canvas.getContext) {
            var context = canvas.getContext('2d');
            if (context) {
                context.strokeStyle = "#369";
                context.lineWidth = 4;


                j = canvas.width / 2;
                k = canvas.height / 2;
                r = canvas.width / 4; 

                function computeX(theta, r, j, k){ return r * Math.cos(theta) + j; }
                function computeY(theta, r, j, k){ return r * Math.sin(theta) + k; }

                start = Math.PI;
                context.lineTo(computeX(start, r, j, k), computeY(start, r, j, k));
                for(var theta = start; theta <= (2*Math.PI); theta += .1) 
                {
                    x = computeX(theta, r, j, k);
                    y = computeY(theta, r, j, k),

                    context.lineTo(x, y);
                }
                context.stroke();
                context.closePath();
            }
        }
    }

编辑: 我知道 arc 函数。我需要以这种方式实现弧,因为这将用作更大问题的一部分,我需要计算弧的每个单独点。


有一个arc功能。

var canvas = document.getElementById("circle-canvas");
var context = canvas.getContext("2d");

var centerX = canvas.width / 2; 
var centerY = canvas.height / 4; 

var radius = canvas.width / 4; 

// I think these values are the angles for the bottom half - otherwise use other values
var startingAngle = Math.PI;
var endingAngle = 0;
var counterclockwise = true;

context.arc(centerX, centerY, radius, startingAngle,
    endingAngle, counterclockwise);

context.lineWidth = 4;
context.strokeStyle = "#369";
context.stroke();
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在画布上绘制圆的下半部分 的相关文章

随机推荐

  • 带开始/暂停和重置按钮的倒计时器

    我想在 React JS 中创建一个倒计时器 其中包含 开始 暂停 和 重置 按钮 以便操作计时器 作为 React 和 JS 的初学者开发人员 我创建了一个状态变量 secondsElapsed 以便输入计时器的时间 以秒为单位 star
  • CSS3 在 ios 上的过渡缓慢/不工作

    我正在尝试在我正在制作的响应式网站上开始使用一些 CSS3 转换 并且在桌面 Chrome 和 Android 上的 Chrome 上一切正常 但在 Chrome 和 Safari 的 iOS 设备上无法正常工作 例如 我用于菜单的 CSS
  • 在 SwiftUI TabView 中禁用滑动手势

    试图实施一个TabView with PageTabView风格SwiftUI 其中导航仅以编程方式完成 并且所有滑动手势均被禁用 这个解决方案 https stackoverflow com questions 63168014 swif
  • 带背景颜色的盒装标签

    如何绘制boxed label具有特定的background颜色 如图例框 你的意思是这样的吗 LABEL label in a box set obj 10 rect at 0 0 size char strlen LABEL char
  • 获得无重力加速度

    我是安卓开发新手 我想获得手机的实际加速度 我找到了一个获得加速度的代码 但它给出了重力加速度 请任何人帮助我找到一种在没有重力的情况下获得实际加速度的方法 这是我找到的代码 请帮我解决这个代码 谢谢 package com SensorT
  • 为什么我必须使用 watir-webdriver 和 firefox 来睡觉或等待?

    好吧 我想对 watir webdriver wait for page load gt 这个主题发表评论 但由于我有 1 个代表 所以我不能 我正在将 watir 脚本升级到 watir webdriver 我在 Firefox 上运行的
  • 如何在浏览器中编辑pdf并将其保存到服务器

    以下是要求 用户需要能够在浏览器中查看上传的 PDF 他们需要能够向 PDF 添加注释并将更新的 PDF 保存到服务器 而无需将其保存到自己的计算机并在浏览器外部打开它 欢迎任何关于如何实现这一目标的想法 顺便说一下 我正在使用一个 asp
  • 错误:静态断言失败:std::thread 参数在转换为右值后必须可调用

    我正在尝试向 std thread 添加 std function 我偶然发现了这个错误 error static assertion failed std thread arguments must be invocable after
  • 与 XML 模式结合使用的表示法名称

    我正在寻找这种风格的名称文字 包含大括号中的完整命名空间 URI 后跟标识符名称 http www w3 org 2001 XMLSchema dateTime 这是 James Clark 提出的一种非常常用的表示法 例如 这就是 JAX
  • 如何在 Visual Studio 2012 中禁用 F12 调试应用程序

    如果我在应用程序在 Visual Studio 下以调试模式运行时按 F12 则 WM KEYDOWN 永远不会到达我的事件循环 但它会立即触发断点 是否可以禁用此功能 或将其重新分配给另一个冲突较少的热键 例如 CTRL F12 我认为这
  • 使用动态规划解决背包问题的一个版本

    我正在 OpenCourseWare 上完成 MIT6 0002 https ocw mit edu courses electrical engineering and computer science 6 0002 introducti
  • iphone/ipad dev - 如何以编程方式启动系统设置应用程序

    在设置 gt 常规中有一个开关可以打开 关闭定位服务 在地图应用中 当定位服务关闭时 如果用户单击 查找我 按钮 则会弹出警报并要求用户在设置中打开定位服务 然后退出应用程序并启动设置应用程序 我如何在我的应用程序中以编程方式执行此操作 从
  • 地图函数未在React jsx中呈现

    我是 React 新手 尝试使用 jsx 内的映射函数来渲染数组 然而 循环内没有任何内容被渲染 我将数据传递给我的子组件 如下所示 showMaterialConfirmModal
  • 使用常量内存打印地址而不是cuda中的值

    我试图在代码中使用常量内存 并从内核分配常量内存值 而不是使用 cudacopytosymbol include
  • 我应该使用哪个 API 在 Windows 上播放音频? [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 在 Windows 上播放声音的方法有很多种 每种方法有哪些差异 优点和缺点 我知道至少有5种方法 1991 WinMM dll mm
  • 在 python 中使用 snappy 和 avro 时出现问题

    我正在读取 gz 文件并转换为 AVRO 格式 当我使用codec deflate 它运行良好 即 我能够转换为 avro 格式 当我使用codec snappy 它抛出一个错误 说明如下 raise DataFileException U
  • 如何使用 Python 裁剪通过鼠标单击选择的区域?

    我正在使用 Matplotlib 和 PIL 使用 python 需要查看图像选择并剪切我必须处理的区域 只留下所选区域的图像 我已经知道如何使用 pil 剪切 imagens 使用im crop 但是我如何选择坐标来通过鼠标单击裁剪图像
  • 调试 SSIS 包 - debug.writeline

    SSIS 中的调试体验不是我所期望的 我有一个脚本任务 我添加了一个Imports System Diagnostics在类的标题处 在代码中我有各种 debug writeline 尝试移动文件 类型的消息 但是 它们没有显示在输出窗口中
  • 如何开始测试(jMock)

    我正在尝试学习如何编写测试 我也在学习 Java 有人告诉我应该学习 使用 练习 jMock 我在网上找到了一些在一定程度上有帮助的文章 例如 http www theserverside com news 1365050 Using JM
  • 如何在画布上绘制圆的下半部分

    我正在尝试使用适当的 x cos theta y sin theta 函数绘制圆的下半部分 如果我将 theta 从 Math PI 迭代到 2 Math PI 我似乎得到了圆的上半部分 我在这段代码片段中做错了什么 window onlo