html5 用canvas画出的图用作html背景
现在有这么个需求:要在雷达扫描上添加商户的图片,然后点图片可以进到用户详细页。
让文字显示在雷达扫描上面,一开始就在研究怎么加div能够显示在最顶层,后来发现canvas是html5的标签。随后就研究怎么在canvas标签上再添加一层图层,废了半天劲,在setup(),load()(radar.js文件中的函数)处下面添加代码不好使(多添加三层图层),如图:
没招啊,在setup()、load()、update()下面添加那段代码都不好使。后来发现思路:可不可以将canvas标签画出的图像用作背景呢,上网找资料尝试一下,发现这个页面:
试了一下,发现扔不太好使。
而且一放posittion:absolute;图像都没了。只能继续找资料,上国外论坛找。发现有这么句话:
说让放在canvas画好之后,所以我就试着放在了update()方法下,如图:
这回竟然好使了,大快人心啊。最后三个文件就是这样的:
然后把下面那个sidebar那个div给隐藏了就行了,那个div还不能删掉,删掉了图像又没了,真神奇。