今天我们来试着移动图片吧！
首先，一样先把图片放到PIXI的stage中：
let app = new PIXI.Application（{
width: 800，
height: 600，
backgroundColor: 0x1099bb
}）；
let imageURL =“./image/bunny.png”；
PIXI.loader
.add（'bunny'，imageURL）
.load（init）；
function init（loader，resources）{
let bunny = new PIXI.Sprite（
resources['bunny'].texture
）；
app.stage.addChild（bunny）；
}
但是，一直显示在左上角实在是有点麻烦，我们可以这样写(vmwork)：
function init（loader，resources）{
let bunny = new PIXI.Sprite（
resources['bunny'].texture
）；
bunny.x = app.screen.width / 2；
bunny.y = app.screen.height / 2；
bunny.scale.set（3.5，3.5）；
app.stage.addChild（bunny）；
}
把bunny的x，y设为canvas的一半，并用scale把大小设为3.5倍。
接着我们监听鼠标事件：
function init（loader，resources）{
let bunny = new PIXI.Sprite（
resources['bunny'].texture
）；
bunny.x = app.screen.width / 2；
bunny.y = app.screen.height / 2；
bunny.scale.set（3.5，3.5）；
bunny.anchor.set（0.5）；
mouseEvent（bunny）；
app.stage.addChild（bunny）；
}
function mouseEvent（bunny）{
bunny.interactive = true；
bunny.buttonMode = true；
bunny.on（'mousedown'，onDragStart）
.on（'mouseup'，onDragEnd）
}
记得要把监听的物件的interactive设为true，否则会无法触发！
buttonMode是让鼠标靠近图片时会转为手指图案（截图弄不出来只能用说明的）。
然后，撰写监听事件，让图片按下时会透明。
function onDragStart（event）{
this.alpha = 0.5；
}
function onDragEnd（）{
this.alpha = 1；
}
接着我们需要能按下拖移：
bunny.on（'mousedown'，onDragStart）
.on（'mouseup'，onDragEnd）
.on（'mousemove'，onDragMove）；
function onDragStart（event）{
this.alpha = 0.5；
this.dragging = true；
}
function onDragEnd（）{
this.alpha = 1；
this.dragging = false；
}
function onDragMove（event）{
if（this.dragging）{
let newPosition = event.data.getLocalPosition（this.parent）；
this.x = newPosition.x；
this.y = newPosition.y；
}
}
首先，我们先对bunny新增一个dragging属性，判断鼠标按下及放开的状态；
接着再设定移动时，如果dragging为true，利用getLocalPosition取得bunny.parent的坐标位置，并同时更新bunny的坐标位置。
就可以顺利移动了喔(leafor)！
那么PixiJS就先到这边告一段落了，一样如果有错误及来源未附上欢迎留言指正，我们明天见！
