@gbeata/mapping
v1.0.16
Published
- <InitStage /> props所有的值先尽可能得枚举出来: - size: {width: number, width: number} - boundary: 地图边界 传值: [ minX, maxY, maxX, maxY, maxX, minY, minX, minY, minX, maxY, ], 不传的话会遍历所有的点得出边界值 - boundaryVisible: 是否显示地图边界 - boundaryProps: React-ko
Downloads
131
Readme
✨MapStage 组件文档
- 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