| | |
| | | |
| | | let app, mapContainer, themeMode; |
| | | let selectedSprite, effectCircle, effectTicker; |
| | | let tooltip; |
| | | |
| | | export function getApp() { |
| | | return app; |
| | |
| | | sprite.off('pointerup'); |
| | | sprite.off('pointermove'); |
| | | sprite.off('pointerdown'); |
| | | sprite.off('pointerover'); |
| | | sprite.off('pointerout'); |
| | | sprite.off('click'); |
| | | |
| | | sprite.on("click", onClick); |
| | | |
| | | function onClick(event) { |
| | | sprite.on("click", (event) => { |
| | | setCurSprite(sprite); |
| | | } |
| | | }); |
| | | |
| | | sprite.on('pointerover', onSpriteMouseOver); |
| | | sprite.on('pointermove', onSpriteMouseMove); |
| | | sprite.on('pointerout', onSpriteMouseOut); |
| | | |
| | | } |
| | | |
| | |
| | | sprite.off('pointerup'); |
| | | sprite.off('pointermove'); |
| | | sprite.off('pointerdown'); |
| | | sprite.off('pointerover'); |
| | | sprite.off('pointerout'); |
| | | sprite.off('click'); |
| | | |
| | | sprite.on("pointerdown", onDragStart); |
| | |
| | | sprite.off('pointerup'); |
| | | sprite.off('pointermove'); |
| | | sprite.off('pointerdown'); |
| | | sprite.off('pointerover'); |
| | | sprite.off('pointerout'); |
| | | sprite.off('click'); |
| | | |
| | | sprite.on("click", onClick); |
| | | |
| | | function onClick(event) { |
| | | sprite.on("click", (event) => { |
| | | setSpriteSettings(sprite); |
| | | }); |
| | | |
| | | sprite.on('pointerover', onSpriteMouseOver); |
| | | sprite.on('pointermove', onSpriteMouseMove); |
| | | sprite.on('pointerout', onSpriteMouseOut); |
| | | |
| | | } |
| | | |
| | | const createSpriteTooltip = (sprite) => { |
| | | const style = new PIXI.TextStyle({ |
| | | fontFamily: 'Microsoft YaHei', |
| | | fontSize: 16, |
| | | fill: '#ffffff', |
| | | stroke: '#4a1850', |
| | | strokeThickness: 2, |
| | | dropShadow: true, |
| | | dropShadowColor: '#000000', |
| | | dropShadowBlur: 4, |
| | | dropShadowAngle: Math.PI / 6, |
| | | dropShadowDistance: 6, |
| | | }); |
| | | |
| | | const text = new PIXI.Text(`编号: ${sprite.data.no}`, style); |
| | | |
| | | const background = new PIXI.Graphics(); |
| | | background.beginFill(0x000000, 0.7); |
| | | background.drawRoundedRect(0, 0, text.width + 20, text.height + 20, 10); |
| | | background.endFill(); |
| | | |
| | | text.x = 10; |
| | | text.y = 10; |
| | | background.addChild(text); |
| | | |
| | | tooltip = new PIXI.Container(); |
| | | tooltip.addChild(background); |
| | | return tooltip; |
| | | } |
| | | |
| | | function onSpriteMouseOver(event) { |
| | | tooltip = createSpriteTooltip(this);// this => sprite |
| | | tooltip.x = event.data.global.x + 10; |
| | | tooltip.y = event.data.global.y + 10; |
| | | app.stage.addChild(tooltip); |
| | | } |
| | | |
| | | function onSpriteMouseMove(event) { |
| | | if (tooltip) { |
| | | tooltip.x = event.data.global.x + 10; |
| | | tooltip.y = event.data.global.y + 10; |
| | | } |
| | | } |
| | | |
| | | function onSpriteMouseOut() { |
| | | if (tooltip && tooltip.parent) { |
| | | tooltip.parent.removeChild(tooltip); |
| | | tooltip = null; |
| | | } |
| | | } |
| | | |