【微信小程序】webgl实现canvas

最新推荐文章于 2024-09-03 16:00:22 发布

猫兮ぃCatci

最新推荐文章于 2024-09-03 16:00:22 发布

阅读量2.3k

点赞数

分类专栏：微信小程序文章标签： canvas 小程序

本文链接：https://blog.csdn.net/qq_45587822/article/details/104738155

版权

微信小程序专栏收录该内容

9 篇文章 0 订阅

订阅专栏

<style>
page{
  height: 200px
}
#myCanvas{
  width: 500px;
  height: 500px
}
</style>
<script>
	// pages/canvas/canvas.js
Page({

  /**
   * 页面的初始数据
   */
  data: {

  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    const query = wx.createSelectorQuery()
    query.select('#myCanvas').node().exec((res) => {
      const canvas = res[0].node
      const gl = canvas.getContext('webgl')
      gl.clearColor(1, 0, 1, 1)
      gl.clear(gl.COLOR_BUFFER_BIT)
    })
  }
 })
</script>
<page>
	<canvas type="webgl" id="myCanvas"></canvas>
</page>