VTS Browser Core API

VTS Core API

The VTS Core API provides a platform for interactive rendering of 3D maps.

The VTS Core API is more low level API than VTS Browser API. The VTS Core API only renders map. Its up to user to implement user interface and navigation. In case you looking for more out of the box solution then you should try VTS Browser API.

Core

Usage Example

<script type="text/javascript"
 src="https://cdn.melown.com/libs/melownjs/core/v2/melown-core.min.js"></script>

var core = vts.core('map-div', {
    position: ["obj",14.824728,50.291323,"float",0,-17,-67,0.00,219,90],
    map: "https://cdn.melown.com/mario/store/melown2015/map-config/melown/Bentky-nad-Jizerou/mapConfig.json"
});

More examples can be found here.

Creation

Factory	Description
vts.core( <HTMLElement/String> id, <CoreOptions> options? )	Creates the map core in the provided HTML element. Initial state of the core can be set by options.

Options

Map State Options

Option	Type	Default	Runtime	Description
position	Position	null	true	Sets initial map position. If position is not defined then default map position is used.
view	String or View	null	true	Sets initial map view. If position is not defined then default map view is used.
map	URL	null	true	Sets URL to map.

Advanced Options

Option	Type	Default	Runtime	Description
mapCache	Number	900	false	Sets map resource cache size in MBs
mapGPUCache	Number	360	false	Sets map GPU cache size in MBs
mapMetatileCache	Number	60	false	Sets map metatile cache size in MBs
mapTexelSizeFit	Number	1.1	false	Sets desired size of of map texels
mapTexelSizeTolerance	Number	2.2	false	Sets maximum temporal size of of map texels
mapDownloadThreads	Number	6	false	Sets how many files can be downloaded concurrently.
mapMaxProcessingTime	Number	2000	false	Sets how much time can used for processing resources during one frame. [unimplemented]
mapMobileMode	Bool	false	false	Forces map to be presented in mobile mode (degraded details). Mobile device is normally detected automatically.
mapMobileModeAutodect	Bool	true	false	Set whether mobile device is autodetected.
mapMobileTexelDegradation	Number	1	false	Sets how much will the map be degraded in mobile mode.
mapNavSamplesPerViewExtent	Number	4	false	Navigation samples per view extent.
mapLoadMode	String	topdown	false	Sets how will be map loaded. Possible values are: "topdown", "fit", "fitonly". The "topdown" mode load map gradually from lower detail to final detail level. The "fit" mode loads map only in final detail level with some detail tolerance during map navigation. The "fitonly" mode loads map only in final detail level, but without detail tolerance during map navigation.
rendererAntialiasing	Bool	true	false	Set whether rendered primitives will be antialiased
rendererAllowScreenshots	Bool	false	false	Set whether screenshots of color buffer are allowed
rendererAntialiasing	Bool	true	false	Set whether rendered primitives will be antialiased

Events

Creating Event Listener

Method	Returns	Description
on(<String> name, <Function> function)	Function	Creates an event listener. Which event is listened to is defined by its name. Once the event occurs the provided function is called. The method returns a function which is a destructor of the created event listener.

General Events

Event	Data content	Description
tick	null	Core heart beat

Core Interfaces

Interface	Returns	Description
map	<Map>	Returns the Map interface. The interface is returned only when maps is loaded (after map-loaded event) otherwise returns null value.
renderer	<Renderer>	Returns the Renderer interface
proj4	<UI>	Returns the Proj4 interface
utils	<utils>	Returns the utils interface
math	<math>	Returns the math interface
vec3	<vec3>	Returns the ve3 interface
mat4	<mat4>	Returns the mat4 interface

Core Methods

Method	Returns	Description
loadMap()	this	Loads a map [experimental]
destroyMap()	this	Destroys a loaded map [experimental]
destroy	this	All core resource are released [experimental]

Methods for Options

Most map options can be set in runtime by the following methods. Whether an option can be changed in runtime is indicated by "Runtime" value in the options table.

Method	Returns	Description
setParam(<String> key, <?> value)	this	Sets a map option
setParams(<CoreOptions> options)	this	Sets map options
getParam(<String> key)	this	Gets a map option value

More Examples

Display a map at specific position with specific map view:

var core = vts.core('map-div', {
    position: ["obj",14.82554328875602,50.29168884599104,"float",0,106,-47,0,219,55],
    view : {
               "freeLayers" : {
			"mapzen-all" : {}
		},
		"surfaces" : {
			"melown-benatky-nad-jizerou" : [],
			"melown-gtopo30-world" : [ "bmng08-world", "mapycz-ophoto-cz" ]
		}
    }
    map: "https://cdn.melown.com/mario/store/melown2015/map-config/melown/Bentky-nad-Jizerou/mapConfig.json"
});

Display a map and set the position and view programmatically:

var core = vts.core('map-div', {
    map: "https://cdn.melown.com/mario/store/melown2015/map-config/melown/Bentky-nad-Jizerou/mapConfig.json"
});

core.on("map-loaded" : (function(){
    var map = core.map;
    map.setPosition(["obj",14.82554328875602,50.29168884599104,"float",0,106,-47,0,219,55]);  
    map.setView({
               "freeLayers" : {
			"mapzen-all" : {}
		},
		"surfaces" : {
			"melown-benatky-nad-jizerou" : [],
			"melown-gtopo30-world" : [ "bmng08-world", "mapycz-ophoto-cz" ]
		}
    });  
}));