| | |
| | | style="position: absolute;top: 20px;right: 50px;background-color: #fff;height: 30px;width: 80px;text-align: center;line-height: 30px;border-radius: 4px;"> |
| | | <div>FPS:{{mapFps}}</div> |
| | | </div> |
| | | |
| | | </div> |
| | | </div> |
| | | </body> |
| | |
| | | el: '#app', |
| | | data: { |
| | | mapFps: 0, |
| | | floor: '1楼', |
| | | sites: ['185', '186', '240', "250", "299"], |
| | | conveyor: [] |
| | | currMap: null, |
| | | conveyor: [], |
| | | |
| | | }, |
| | | created() { |
| | | mapData |
| | | |
| | | }, |
| | | mounted() { |
| | | this.createMapData() |
| | | this.createMapData(mapData.conveyor) |
| | | this.createMap() |
| | | |
| | | setInterval(() => { |
| | |
| | | |
| | | }, |
| | | methods: { |
| | | createMapData() { |
| | | this.conveyor = mapData.conveyor |
| | | console.log(this.conveyor); |
| | | createMapData(conveyor) { |
| | | this.conveyor = conveyor |
| | | |
| | | }, |
| | | getSiteInfo() { |
| | |
| | | // } |
| | | if (site.siteStatus == 'site-auto-run-id') { |
| | | // 自动+有物+ID |
| | | conve.background = 0xFC3030 |
| | | // conve.background = 0xFC3030 |
| | | |
| | | } else if (site.siteStatus == 'site-auto-run') { |
| | | // 自动+有物 |
| | |
| | | pixiApp.stage.addChild(text); |
| | | } |
| | | |
| | | for (let k of mapData.conveyor) { |
| | | for (let k of this.conveyor) { |
| | | let rectangle = new PIXI.Graphics(); |
| | | rectangle.beginFill(k.background); |
| | | // rectangle.originColor = k.background; |
| | |
| | | rectangle.on('mouseover', onMouseOver) |
| | | function onMouseOver(event) { |
| | | rectangle.alpha = k.alpha ? k.alpha : 1 |
| | | console.log(event); |
| | | // 创建内容框 |
| | | let tooltip = new PIXI.Graphics(); |
| | | tooltip.beginFill(0xFFFFFF); // 内容框背景颜色 |