Added functionality and dark mode to doctests. And other changes in maps.
This commit is contained in:
@@ -26,7 +26,6 @@ export class GeoGraphics {
|
||||
this.drawEndHandler = new EventHandler('onDrawEnd', { listeners: onDrawEnd })
|
||||
this._points = null
|
||||
this._position = null
|
||||
this.map = null
|
||||
}
|
||||
|
||||
clone() {
|
||||
@@ -92,7 +91,6 @@ export class GeoGraphics {
|
||||
* Called by the containing geo layer, when the map changes.
|
||||
*/
|
||||
adaptTo(map) {
|
||||
this.map = map
|
||||
this._points = this._adaptCoordinates(map)
|
||||
this._updatePosition()
|
||||
this.draw()
|
||||
@@ -135,23 +133,21 @@ export class GeoGraphics {
|
||||
this._layer = layer
|
||||
}
|
||||
|
||||
// get map() {
|
||||
// if (
|
||||
// this.graphics.layer &&
|
||||
// (this.graphics.layer instanceof GeoLayer || this.graphics.layer instanceof MapLayer)
|
||||
// ) {
|
||||
// return this.graphics.layer.map
|
||||
// } else return null
|
||||
// }
|
||||
get map() {
|
||||
let map = null
|
||||
if (this.mapLayer) {
|
||||
map = this.mapLayer.map
|
||||
}
|
||||
return map
|
||||
}
|
||||
|
||||
// get mapLayer() {
|
||||
// if (
|
||||
// this.graphics.layer &&
|
||||
// (this.graphics.layer instanceof GeoLayer || this.graphics.layer instanceof MapLayer)
|
||||
// ) {
|
||||
// return this.graphics.layer.mapLayer
|
||||
// } else return null
|
||||
// }
|
||||
get mapLayer() {
|
||||
let mapLayer = null
|
||||
if (this.layer) {
|
||||
mapLayer = this.layer.mapLayer
|
||||
}
|
||||
return mapLayer
|
||||
}
|
||||
|
||||
/**
|
||||
* Prepare draw is a private function, that prepares the graphics
|
||||
|
||||
+48
-24
@@ -145,6 +145,19 @@ export class GeoLayer {
|
||||
} else console.warn('Tried to remove layer that was not set.', this, layer)
|
||||
}
|
||||
|
||||
remove(graphics) {
|
||||
if (graphics instanceof GeoGraphics) {
|
||||
let index = this.geographics.indexOf(geographics)
|
||||
if (index != -1) {
|
||||
this.displayObject.removeChild(geographics)
|
||||
} else {
|
||||
console.error('Could not remove geographics from geolayer.', this, geographics)
|
||||
}
|
||||
} else {
|
||||
this.displayObject.removeChild(graphics)
|
||||
}
|
||||
}
|
||||
|
||||
set parent(parent) {
|
||||
this._parent = parent
|
||||
}
|
||||
@@ -208,9 +221,10 @@ export class GeoLayer {
|
||||
|
||||
export class MapLayer extends GeoLayer {
|
||||
constructor(
|
||||
mapList,
|
||||
scatterContainer,
|
||||
displayObject,
|
||||
{ onTransform = null, onChange = null, focus = null, zoom = null, viewport = null, mapList = null } = {}
|
||||
{ onTransform = null, onChange = null, focus = null, zoom = null, viewport = null } = {}
|
||||
) {
|
||||
super(displayObject)
|
||||
|
||||
@@ -231,12 +245,16 @@ export class MapLayer extends GeoLayer {
|
||||
})
|
||||
|
||||
this.mapList = mapList
|
||||
this._map = null
|
||||
|
||||
// //TODO Implement error handling here.
|
||||
// this.maps = maps
|
||||
// if (opts.map) this.placeMap(opts.map)
|
||||
this.dynamicElements = new Map()
|
||||
|
||||
// Binds the transformed callback beforehand.
|
||||
this.transformed = this.transformed.bind(this)
|
||||
|
||||
this.changeMap(mapList.active)
|
||||
}
|
||||
|
||||
adapt() {
|
||||
@@ -258,21 +276,18 @@ export class MapLayer extends GeoLayer {
|
||||
this.transformHandler.call(this)
|
||||
}
|
||||
|
||||
clone(container = null) {
|
||||
let clone = {}
|
||||
for (let name of Object.keys(this.maps)) {
|
||||
//console.info(this.maps[name])
|
||||
clone[name] = this.maps[name].clone(container)
|
||||
}
|
||||
clone(scatterContainer, container = null) {
|
||||
let mapList = this.mapList.clone()
|
||||
container = container == null ? new PIXI.Container() : container
|
||||
|
||||
//console.info(this.active)
|
||||
let mapLayerClone = new MapLayer(this.active, clone, container, {
|
||||
let mapLayerClone = new MapLayer(mapList, scatterContainer, container, {
|
||||
name: MapLayer.idx++,
|
||||
viewport: this.mapview.viewport,
|
||||
focus: this.mapview.focus,
|
||||
zoom: this.mapview.zoom
|
||||
zoom: this.mapview.zoom,
|
||||
mapList
|
||||
})
|
||||
//mapLayerClone._map = clone['luftbild']
|
||||
|
||||
mapLayerClone.childrenVisibility = this.childrenVisibility
|
||||
return mapLayerClone
|
||||
}
|
||||
@@ -285,20 +300,29 @@ export class MapLayer extends GeoLayer {
|
||||
* @memberof MapLayer
|
||||
*/
|
||||
changeMap(
|
||||
map /*,
|
||||
name
|
||||
/* map ,
|
||||
useScatterAsContainer = true // If set to false, the normal container is used. This is necessary when using submaps and the container need to be a RigidContainer.*/
|
||||
) {
|
||||
if (map instanceof GeoMap) {
|
||||
console.log('Change map to: ', map)
|
||||
let oldMap = this.map
|
||||
if (oldMap) oldMap.unload()
|
||||
console.log('Change map to: ', name)
|
||||
let oldMap = this.map
|
||||
|
||||
this._map = map
|
||||
this.mapList.select(name)
|
||||
|
||||
this.map.load()
|
||||
this.scatterContainer.addChild(this.map.image)
|
||||
if (oldMap) {
|
||||
oldMap.unload()
|
||||
oldMap.onTransform.remove(this.transformed)
|
||||
}
|
||||
|
||||
this.mapview.apply(this.map)
|
||||
let map = this.map
|
||||
if (map) {
|
||||
console.log('Load Map')
|
||||
map.load()
|
||||
|
||||
console.log(this, this.scatterContainer)
|
||||
this.scatterContainer.addChild(map.image)
|
||||
|
||||
this.mapview.apply(map)
|
||||
map.image.addChild(this.displayObject)
|
||||
|
||||
// A geolayer's displayObject is on the parent layer.
|
||||
@@ -309,9 +333,9 @@ export class MapLayer extends GeoLayer {
|
||||
|
||||
//Call transform one time manually.
|
||||
this.transformed()
|
||||
this.map.onTransform.add(this.transformed.bind(this))
|
||||
map.onTransform.add(this.transformed)
|
||||
} else {
|
||||
console.error("Could not set map, it's not of type GeoMap.", map)
|
||||
console.error(`Could not change map to ${name}.`)
|
||||
}
|
||||
|
||||
/*Logging.log(`Map change: ${key}`)
|
||||
@@ -368,7 +392,7 @@ export class MapLayer extends GeoLayer {
|
||||
}
|
||||
|
||||
get map() {
|
||||
return this._map
|
||||
return this.mapList.map
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
+23
-6
@@ -291,6 +291,10 @@ export class GeoMap {
|
||||
console.error('Overload get distance in subclass.')
|
||||
}
|
||||
|
||||
set alpha(value) {
|
||||
console.error('Overload get alpha in subclass.')
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns a screen point for a coordinate.
|
||||
*/
|
||||
@@ -374,11 +378,13 @@ export class GeoMap {
|
||||
* @returns {object} - Returns an object with the names as keys and the GeoMaps as value.
|
||||
* @memberof GeoMap
|
||||
*/
|
||||
static allFromJson(json) {
|
||||
static allFromJson(json, root = './') {
|
||||
let error = { message: '' }
|
||||
let maps = {}
|
||||
if (GeoMap._validateJson(json, error)) {
|
||||
for (let [mapname, data] of Object.entries(json)) {
|
||||
console.log(data.tiles, data.tiles.path, root + data.tiles.path)
|
||||
data.tiles.path = root + data.tiles.path
|
||||
maps[mapname] = GeoMap._createMap(data)
|
||||
maps[mapname].name = mapname
|
||||
}
|
||||
@@ -563,6 +569,7 @@ export class DeepZoomMap extends GeoMap {
|
||||
|
||||
super.load(image, container, scatter)
|
||||
|
||||
console.log('LOADED: ', this.image)
|
||||
if (this.debug) console.log('Loaded image: ', image, 'With options: ', this.info)
|
||||
}
|
||||
|
||||
@@ -622,7 +629,7 @@ export class DeepZoomMap extends GeoMap {
|
||||
|
||||
let containerCenter
|
||||
if (this.frame) {
|
||||
containerCenter = this.getFrame().center
|
||||
containerCenter = this.getFrame().localCenter
|
||||
} else {
|
||||
containerCenter = {
|
||||
x: this.image.parent.width / 2,
|
||||
@@ -691,10 +698,21 @@ export class DeepZoomMap extends GeoMap {
|
||||
|
||||
tint() {
|
||||
let color = DeepZoomMap.tintcolors[DeepZoomMap.tintcolor++ % DeepZoomMap.tintcolors.length]
|
||||
|
||||
this._forEachTile(tile => {
|
||||
tile.tint = color
|
||||
})
|
||||
}
|
||||
|
||||
_forEachTile(callback) {
|
||||
this.image.children[0].children.forEach(tiles => {
|
||||
tiles.children.forEach(tile => {
|
||||
tile.tint = color
|
||||
})
|
||||
tiles.children.forEach(callback)
|
||||
})
|
||||
}
|
||||
|
||||
setAlpha(alpha) {
|
||||
this._forEachTile(tile => {
|
||||
tile.alpha = alpha
|
||||
})
|
||||
}
|
||||
|
||||
@@ -769,7 +787,6 @@ export class ImageMap extends GeoMap {
|
||||
* @memberof ImageMap
|
||||
*/
|
||||
moveTo(coordinates, zoom = null, { animate = 0 } = {}) {
|
||||
|
||||
if (this.image.scatter == null) {
|
||||
return
|
||||
}
|
||||
|
||||
@@ -178,6 +178,7 @@ export default class MapApp extends PIXIApp {
|
||||
|
||||
selectMap(key) {
|
||||
let result = this.mapList.select(key)
|
||||
|
||||
console.log('Select map', key, result)
|
||||
if (result && this.mapLayer) {
|
||||
this.mapLayer.changeMap(this.mapList.map)
|
||||
@@ -287,7 +288,6 @@ export default class MapApp extends PIXIApp {
|
||||
}
|
||||
|
||||
get map() {
|
||||
console.log(this.mapList)
|
||||
return this.mapList.map
|
||||
}
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
export class MapList {
|
||||
constructor(active, maps) {
|
||||
constructor(active = null, maps = {}) {
|
||||
this.maps = maps
|
||||
this.active = active
|
||||
|
||||
@@ -40,6 +40,16 @@ export class MapList {
|
||||
return map
|
||||
}
|
||||
|
||||
clone() {
|
||||
let maps = {}
|
||||
|
||||
for (let name of Object.keys(this.maps)) {
|
||||
maps[name] = this.maps[name].clone()
|
||||
}
|
||||
|
||||
return new MapList(this.active, maps)
|
||||
}
|
||||
|
||||
add(key, map) {
|
||||
if (this.maps[key] != null) consol.warn('Key already in mapList. The existing key was overwritten.')
|
||||
map.name = key
|
||||
@@ -47,15 +57,14 @@ export class MapList {
|
||||
}
|
||||
|
||||
get map() {
|
||||
console.log(this.maps, this.active)
|
||||
return this.maps[this.active]
|
||||
return this.maps && this.maps[this.active] ? this.maps[this.active] : null
|
||||
}
|
||||
|
||||
next() {
|
||||
let keys = Object.keys(this.maps)
|
||||
let idx = keys.indexOf(this.active)
|
||||
|
||||
let next = idx + 1 < key.length ? keys[idx + 1] : keys[0]
|
||||
let next = idx + 1 < keys.length ? keys[idx + 1] : keys[0]
|
||||
console.log(keys, idx, next)
|
||||
return next
|
||||
}
|
||||
|
||||
@@ -89,15 +89,15 @@ export class AdvancedScatterContainer extends ScatterContainer {
|
||||
let interactionManager = this.renderer.plugins.interaction
|
||||
|
||||
let displayObject = interactionManager.hitTest(local, this)
|
||||
|
||||
if (displayObject.dontBlockScatter && displayObject.parent != null) {
|
||||
displayObject = interactionManager.hitTest(local, displayObject.parent)
|
||||
if (displayObject != null) {
|
||||
if (displayObject.dontBlockScatter && displayObject.parent != null) {
|
||||
displayObject = interactionManager.hitTest(local, displayObject.parent)
|
||||
}
|
||||
|
||||
if (displayObject.scatter != null) this.hitScatter = displayObject.scatter
|
||||
if (this.claimEvents) event.claimedByScatter = this.hitScatter
|
||||
}
|
||||
|
||||
if (displayObject != null && displayObject.scatter != null) this.hitScatter = displayObject.scatter
|
||||
if (this.claimEvents) event.claimedByScatter = this.hitScatter
|
||||
|
||||
|
||||
return this.hitScatter
|
||||
}
|
||||
}
|
||||
@@ -255,6 +255,23 @@ class AdvancedScatter extends DisplayObjectScatter {
|
||||
}
|
||||
|
||||
export class SubmapScatter extends DisplayObjectScatter {
|
||||
constructor(displayObject, renderer, opts = {}) {
|
||||
/*
|
||||
Currently the submaps are only working on one scale to
|
||||
avoid recalculations of the shown map.
|
||||
|
||||
Therfore we force the scatter to not be scaleable.
|
||||
*/
|
||||
Object.assign(opts, {
|
||||
minScale: 1,
|
||||
maxScale: 1,
|
||||
startScale: 1,
|
||||
scalable: false
|
||||
})
|
||||
|
||||
super(displayObject, renderer, opts)
|
||||
}
|
||||
|
||||
get width() {
|
||||
return this.displayObject.width * this.displayObject.scale.x
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user