#

Junjie

2024-06-16 83c548d3dba59aaed9b52b5d413c6912a87d2efc

 zy-asrs-flow/src/pages/map/utils.js

@@ -5,6 +5,7 @@
import { API_TIMEOUT } from '@/config/setting'
import agv from '/public/img/map/agv.svg'
import shelf from '/public/img/map/shelf.png'
import point from '/public/img/map/point.svg'

let app = null;
let mapContainer = null;
@@ -28,6 +29,7 @@

export const SENSOR_TYPE = Object.freeze({
    SHELF: "SHELF",
    POINT: "POINT",
    AGV: "AGV",
})

@@ -307,6 +309,12 @@
                    label: intl.formatMessage({ id: 'map.sensor.type.agv', defaultMessage: '无人小车' })
                })
                break;
            case SENSOR_TYPE.POINT:
                options.push({
                    value: value,
                    label: intl.formatMessage({ id: 'map.sensor.type.point', defaultMessage: '定位点' })
                })
                break;
            default:
                break;
        }
@@ -327,6 +335,9 @@
                    break;
                case SENSOR_TYPE.AGV:
                    sprite = PIXI.Sprite.from(agv);
                    break;
                case SENSOR_TYPE.POINT:
                    sprite = PIXI.Sprite.from(point);
                    break;
                default:
                    break;
@@ -411,20 +422,20 @@
        return;
    }

    // 获取 sprite 的中心点坐标
    mapContainer.scale.set(1);
    mapContainer.position.set(0, 0);

    let bounds = sprite.getBounds();
    let centerPoint = {
        x: bounds.x + bounds.width / 2,
        y: bounds.y + bounds.height / 2
    };

    // 计算 sprite 应当平移的像素量以能够将其放置到屏幕中心
    let targetPos = {
        x: app.renderer.width / 2 - centerPoint.x * this.scale,
        y: app.renderer.height / 2 - centerPoint.y * this.scale
        x: app.renderer.width / 3 - centerPoint.x * mapContainer.scale.x,
        y: app.renderer.height / 3 - centerPoint.y * mapContainer.scale.y
    };

    // 使用 TWEEDLE.Tween 动画库为平移过程添加过渡效果
    new TWEEDLE.Tween(mapContainer.position).easing(TWEEDLE.Easing.Quadratic.Out)
        .to(targetPos, 200).start();
        .to(targetPos, 500).start();
}