dp3d_zx

Project setup

1.创建canvas画布

let options = {
    canvas : 'canvas',//画布id
    container : "container",//画布外容器
    buildID : "build",//建筑图标ID
    scope : 1.6, //缩放大小范围
    step : 0.02//缩放每步大小
}

let scene = new CanvasZx(options)

2.加载图片

let list =[
  {id: "1", isFlicker: true, position: {x: 100, y: 100}, img: require("@/assets/image/canvas/icon-fj3.svg")},
  {id: "2", isFlicker: true, position: {x: 200, y: 100}, img: require("@/assets/image/canvas/icon-fj3.svg")},
  {id: "build", position: {x: 0, y: 0}, img: require("@/assets/image/canvas/3.png")},
]

2.加载图片
scene.onLoadAll(list)

3.更新图标

let newList =[
  {id: "1", isFlicker: true, position: {x: 100, y: 100}, img: require("@/assets/image/canvas/icon-fj3.svg")},
  {id: "2", isFlicker: true, position: {x: 200, y: 100}, img: require("@/assets/image/canvas/icon-fj3.svg")},
]
scene.updateIcon(newList)

4.点击图标返回数据

scene.callback((e) => {
      console.log(e)
})