小地图渲染

1、初始化

小地图的初始化和可编辑户型图的初始化一样，只需要在初始化的时候添加一个mode字段即可

//<div id='map'></div> 

var thumbnail = new Palette({
    mode: 'view' // 必须添加，表示当前画板只做渲染
    width: 125,
    height: 125,
    plottingScale: 1, 
    containerId: "map",
    backgroundImg:'', // 非必要
    data: JSON.parse(JSON.stringify(vectorMap)), //orthomap.json的vectorMap字段值
    refs: { // 非必要
      url: '',
    },
    rotation: 0,
    ratio: 1,
    styleOptions: {
      wallColor: 0x959595,
    },
  });

2、ratio字段说明

小地图和可编辑户型图初始化都有ratio字段，表示初始绘制内容的缩放，当两者关联渲染时，要做比例兼容

具体如何兼容案例如下：

var boxSize = 550
// scale 初始缩放比例，默认1
// 户型图编辑面板
var baseSize = 900;
var palette = new Palette({
  // ...
  width: 900，
  height: 900
  ratio:( scale * baseSize) / boxSize 
})
// 小地图
// 900是户型图编辑面板的宽度，125是小地图的宽度
var correct = （baseSize / 900）* 125
var thumbnail = new Palette({
  // ...
  width: 125，
  height: 125
  ratio:( scale * correct) / boxSize 
})

比例不相同会出现如下情况

3、画板（背景图+绘制内容）操作

// 缩放
thumbnail.worldScale(ratio: number)

// 平移
thumbnail.worldTranslate(x: number, y: number)

// 旋转
thumbnail.rotate(rotation: number)

4、其他方法

// 初始化小地图数据
thumbnail.initData(vectorMap)