@gbeata/mapping

✨MapStage 组件文档

• props所有的值先尽可能得枚举出来:
• size: {width: number, width: number}
• boundary: 地图边界 传值: [ minX, maxY, maxX, maxY, maxX, minY, minX, minY, minX, maxY, ], 不传的话会遍历所有的点得出边界值
• boundaryVisible: 是否显示地图边界
• boundaryProps: React-konva中的LineProps,除了points其他都可以传,默认为黑色虚线
• defaultMapCenter: { x: number, y: number } 初始化定位视图聚焦的中心点,如果不传则定位到边界的中心点，要配合ratio计算

• baseMap: 底图的点位 => [x1,y1,x2,y2,x3,y3,x4,x5,y5]

• baseMapProps: React-konva中的LineProps,不传默认为一个闭合的图形

• points: []

  • id // 手动去重,防止报错
  • types // 判断点类型
  • x: number
  • y: number
  • state: number // 判断状态

• pointProps: React-konva中的RectProps

• pointsValue:[]

• onPointsSelect: (points: IPoint[]) => void

• multiCheckedPoints: (points: IPoint[]) => void // 什么时候清除呢

• clearCheckedPoints: () => void

• lines: []

  • id
  • points

• lineProps: React-konva中的LineProps

• vehicles: []

  • id
  • x
  • y
  • name
  • battery
  • state

• followVehicleView: undefined| false | vehicleId , 是否要锁定小车视角，每次只能一辆车,锁定后视图跟随小车移动

• blocks: [ {points: [x1,y1,x2,y2,x3,y3,x4,y4], title:string, props: LineProps} ] 可以生成区块

• onStageClick: (position: {x: number, y: number})=>void 点击stage的任意位置,这个应该没什么用

• minRatio: 最小缩放的比例: 表现为100px的屏幕像素代表实际是多少mm
• maxRatio: 最小缩放的比例: 同上; 两个都不设置则为无限视距
• onRatioChange: (ratio)=> void 比例改变的时候, 自己去控制线段是否显示,也可以自己根据其他东西去显示
• scaleBy: 每次缩放的速度，在pc上就是滚轮滚动的速度
• linesVisible: 线段是否要显示
• storagePointsVisible: 是否显示库位
• commonPointsVisible: 点位和名字是否显示
• linesDirectionVisible: 线段方向是否显示

• mergeLines: 线段是否合并,不需要显示线段的id的时候可以用这个，可以保持图形不变的情况下减少线段的数量

npm 上传卡顿,可以执行下面的命令 npm config set proxy false npm cache clean