h5已经写好的canvas游戏怎么顺利移植到微信小游戏里呢，其实也很简单，先解决以下几个大问题就差不多了。

1、只能创建一个canvas

如果你在h5上创建了多个canvas然后想合并到大的canvas，在微信小游戏上是有很多问题的，有的canvas会合并之后并没有显示出来；

2、创建canvas语句替换

h5上的我们直接 

canvas = document.createElement('canvas');

在微信上使用

canvas = wx.createCanvas();

注：canvas 要使用全局变量

3、js的window对象

微信小游戏里没有定义 window

如果你在js里把window当成一个全局变量来使用的话这时就要做如下修改

window = window || GameGlobal;

微信小游戏里用GameGlobal 用它来做全局变量

注意 js 里的 window.innerWidth
获取屏幕的宽高等 是不能这样用的，下面会讲。

4、获取屏幕的宽和高

js里通常用 window.innerWidth 和 window.innerHeight来获取屏幕的宽和高

微信小游戏里要用他们官方的api了，如下

WIDTH = wx.getSystemInfoSync().windowWidth,

HEIGHT = wx.getSystemInfoSync().windowHeight

5、常用事件api

h5里的常用三个事件

手指的触摸事件 touchstart（手指开始按下去事件） touchmove（手指移动事件）  touchend （手指离屏事件）

canvas.addEventListener('touchstart', ((e) => {

    e.preventDefault();

  }));

这个对应的微信api为

wx.onTouchStart(function(e){

ship.touched = true;

    //e.touches[0].clientX; //手指到左边屏幕的距离

    //e.touches[0].clientY;//手指到上边屏幕的距离

});

canvas.addEventListener('touchmove', ((e) => {

    e.preventDefault();

  }));

这个对应的微信api为

wx.onTouchMove(function(e){

    //e.touches[0].clientX; //手指到左边屏幕的距离

    //e.touches[0].clientY;//手指到上边屏幕的距离

});

canvas.addEventListener('touchend', ((e) => {  

}));

这个对应的微信api为

wx.onTouchEnd(function(e){

});