鸿蒙 ets 绘制正余弦

最新推荐文章于 2024-06-20 17:32:35 发布

臭宝guai

最新推荐文章于 2024-06-20 17:32:35 发布

阅读量276

点赞数

分类专栏： ets 文章标签：前端 javascript css ets

本文链接：https://blog.csdn.net/choubaoguai/article/details/125748535

版权

本文详细介绍了如何在鸿蒙操作系统上，利用ETS（EcoSystem Tools）进行图形编程，实现正弦和余弦函数的曲线绘制。通过JavaScript和CSS技术，结合ETS提供的API，创建动态且精确的数学图表，为开发者展示了一种在鸿蒙设备上进行图形界面开发的方法。

摘要由CSDN通过智能技术生成

@Entry
@Component
struct Logo {
  private settings: RenderingContextSettings = new RenderingContextSettings(true);
  private ctx: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);

  build() {
    Flex({ alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
      Canvas(this.ctx)
        .backgroundColor('#000000')
        .onReady(() => {
          let positionY = 100;
          let positionX = 10;
          let waveWith = 20;

          let waveStep = 0.1;
          let pi = Math.PI * 0;


          this.ctx.fillStyle="#FFFFFF";
          //        ctx.fillRect(0,0,400,300);
          this.ctx.strokeStyle="red";
          this.ctx.lineWidth=2;
          this.ctx.beginPath();
          //this.ctx.moveTo( positionX, positionY - waveWith);//sin的话，这里为ctx.moveTo(10,position);
          for( let i = 0; i < 40; i += waveStep ){ // x 应该等于canvas的