IWMBrowser/iwmlib
4
0
Fork 0
Code Issues 6 Pull Requests Releases Wiki Activity

Fixed cover bug. Renamed mapdata to mapprojection.

Browse Source
This commit is contained in:
Severin Opel
2019-12-11 16:45:26 +01:00
parent a85569e54d
commit 1e80845aa6
82 changed files with 5473 additions and 5059 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/pixi/maps/map.js
+49 -36
View File
@@ -1,12 +1,12 @@
import { MapObjectScatter } from './scatter.js'
import { DeepZoomImage, DeepZoomInfo } from '../deepzoom/image.js'
import { MapData, DeepZoomMapData } from './mapdata.js'
import { MapProjection, DeepZoomMapProjection } from './mapprojection.js'
import { Points } from '../../utils.js'
import { EventHandler } from './utils.js'
import Mercator from './projections/mercator.js'
/**
* The GeoMap class displays a map, that it gets from MapData object.
* The GeoMap class displays a map, that it gets from MapProjection object.
* It handles the current location on the map, the zoom factor, interactions and
* the viewport, the area of the map, the user can see and navigate to.
*
@@ -26,12 +26,12 @@ export class GeoMap {
* Creates instance of GeoMap
*
* @constructor
* @param {MapData}[mapdata={}] - The mapdata describes how the map has to be interpreted by the Map class. E.g. what are the boundaries of the map?
* @param {MapProjection}[mapProjection={}] - The map projection describes how the map has to be interpreted by the Map class. E.g. what are the boundaries of the map?
* @param {object}[opts={}] - With the opts, the created MapObjectScatter can be adjusted.
* @param {boolean}[opts.cover=false] - Enables covering behaviour of a map object. Normally maps should cover the whole app.
*/
constructor(
mapdata = {},
mapProjection = {},
{
debug = true,
cover = true,
@@ -43,7 +43,7 @@ export class GeoMap {
translatable = true,
scalable = true,
rotatable = false, // Many functionalities are not supported when rotating the map. Mainly the cover mechanism.
viewport = mapdata.maxViewport,
viewport = mapProjection.maxViewport,
// Events
onLoad = null,
onTransform = null
@@ -54,6 +54,7 @@ export class GeoMap {
this.onTransform = new EventHandler('transform', { listeners: onTransform })
this._alpha = alpha
this._cover = cover
this.debug = debug
//TODO discuss if this is required here.
@@ -67,15 +68,15 @@ export class GeoMap {
this.scalable = scalable
this.viewport = viewport
this._mapdata = mapdata
this._mapProjection = mapProjection
this.overlays = {}
/**
* Adjust the viewport depending on the mapdata clipping.
* Adjust the viewport depending on the mapProjection clipping.
*/
if (this.mapdata.clip) {
if (this.mapProjection.clip) {
const vp = this.viewport
const cp = this.mapdata.clip
const cp = this.mapProjection.clip
let bounds = {
min: {
x: vp.min.x > cp.min.x ? vp.min.x : cp.min.x,
@@ -91,6 +92,18 @@ export class GeoMap {
}
}
/**
* Determines if the scatter covers the container.
* @member {boolean}
* @readonly
* @memberof GeoMap
*/
get cover() {
return this._cover
}
/**
* Returns the image object used by the GeoMap.
*
@@ -102,14 +115,14 @@ export class GeoMap {
}
/**
* The mapdata of the map.
* The mapProjection of the map.
*
* @member {MapData}
* @member {MapProjection}
* @readonly
* @memberof GeoMap
*/
get mapdata() {
return this._mapdata
get mapProjection() {
return this._mapProjection
}
/**
@@ -279,7 +292,7 @@ export class GeoMap {
* @returns {object} - Coordinates on the map in form of {x: latitude, y: longitude}.
*/
coordinatesFromPoint(point) {
let coords = this.mapdata.toCoordinates(this.toRelativePosition(point))
let coords = this.mapProjection.toCoordinates(this.toRelativePosition(point))
return coords
}
@@ -290,7 +303,7 @@ export class GeoMap {
* @return {Point} - Returns a image position in form of {x: x, y: y}.
*/
coordinatesToPoint(coordinates) {
return this.toAbsolutePixelCoordinates(this.mapdata.toPixel(coordinates))
return this.toAbsolutePixelCoordinates(this.mapProjection.toPixel(coordinates))
}
toRelativePosition(point) {
@@ -549,8 +562,8 @@ export class GeoMap {
const tilesConfig = data.tiles
const options = data.options
const mapdata = new DeepZoomMapData(projection, tilesConfig)
return new DeepZoomMap(mapdata, tilesConfig, options)
const mapProjection = new DeepZoomMapProjection(projection, tilesConfig)
return new DeepZoomMap(mapProjection, tilesConfig, options)
}
static _getProjectionByName(projection) {
@@ -578,31 +591,31 @@ export class DeepZoomMap extends GeoMap {
/**
* @constructor
* @param {object} tilesConfig - The tiles config object, that defines at what path and in which format the tiles are.
* @param {MapData} mapdata - A MapData object, that contains informations of how the given map has to be interpreted.
* @param {MapProjection} mapProjection - A MapProjection object, that contains informations of how the given map has to be interpreted.
* @param {object} opts - Additional options to specify the behaviour of the deep zoom image.
*/
constructor(mapdata, tilesConfig, opts = {}) {
constructor(mapProjection, tilesConfig, opts = {}) {
opts = Object.assign(
{
maxScale: Math.min(tilesConfig.width, tilesConfig.height) / tilesConfig.tileSize,
minScale: mapdata.getMinScale,
minScale: mapProjection.getMinScale,
highResolution: true,
debug: false
},
opts
)
super(mapdata, opts)
super(mapProjection, opts)
this.tilesConfig = tilesConfig
this._verifyMapdata()
this._verifyMapProjection()
}
_verifyMapdata() {
if (!(this.mapdata instanceof MapData)) {
console.error('Use the MapData object for creating maps!')
_verifyMapProjection() {
if (!(this.mapProjection instanceof MapProjection)) {
console.error('Use the MapProjection object for creating maps!')
} else {
if (!(this.mapdata instanceof DeepZoomMapData)) {
console.error('Use the DeepZoomMapData object.')
if (!(this.mapProjection instanceof DeepZoomMapProjection)) {
console.error('Use the DeepZoomMapProjection object.')
}
}
}
@@ -613,10 +626,10 @@ export class DeepZoomMap extends GeoMap {
* @private
*/
load(container = null, scatter = null) {
if (!this.mapdata.app) console.error('App was not set in the mapdata.')
if (!this.mapProjection.app) console.error('App was not set in the mapProjection.')
this.info = new DeepZoomInfo(this.tilesConfig)
let image = new DeepZoomImage(this.info, {
app: this.mapdata.app,
app: this.mapProjection.app,
alpha: this.alpha,
debug: this.debug,
world: scatter == null ? scatter : scatter.getWorldScatter()
@@ -734,9 +747,9 @@ export class DeepZoomMap extends GeoMap {
}
clone(container, scatter = null) {
const map = new DeepZoomMap(this.mapdata, this.tilesConfig, {
const map = new DeepZoomMap(this.mapProjection, this.tilesConfig, {
alpha: this.alpha,
cover: this.cover,
cover: this.image.scatter.cover,
debug: this.debug,
startScale: this.startScale,
minScale: this.minScale,
@@ -802,9 +815,9 @@ DeepZoomMap.tintcolor = 0
* @extends {GeoMap}
*/
export class ImageMap extends GeoMap {
constructor(sprite, mapdata, opts = {}) {
super(mapdata, opts)
if (this.debug) console.log('Construct Image Map', sprite, mapdata, opts)
constructor(sprite, mapProjection, opts = {}) {
super(mapProjection, opts)
if (this.debug) console.log('Construct Image Map', sprite, mapProjection, opts)
this.sprite = sprite
@@ -818,9 +831,9 @@ export class ImageMap extends GeoMap {
}
clone(container = null, scatter = null) {
const map = new ImageMap(new PIXI.Sprite(this.sprite.texture), this.mapdata, {
const map = new ImageMap(new PIXI.Sprite(this.sprite.texture), this.mapProjection, {
alpha: this.alpha,
cover: this.cover,
cover: this.image.cover,
debug: this.debug,
startScale: this.startScale,
minScale: this.minScale,