Skip to content

VTS Browser Core API

David Levinsky edited this page Oct 18, 2019 · 4 revisions

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/vtsjs/browser/v2/vts-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 Read more
mapFeaturesReduceMode string scr-count1 false Read more
mapFeaturesReduceParams Array Numbers [0, 0, 0, 0, 0] false Read more
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

Load modes

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.

Geodata reduce modes

Sets how geodata features will be reduced. Supported values are: "scr-count1", "scr-count7". The mode "scr-count1" is only used to disable "scr-count7". The mode "scr-count7" will reduce number of rendered geodata features (works only for: points,labels,icons) to density defined by mapFeaturesReduceParams. Which features are more important then other is based on value of feature property "importace-source" (defined in geodata styles).

Reduce modes parameters

Sets parameters for mapFeaturesReduceMode. Default values for "scr-count1" are [0, 0, 0, 0, 0]. The mode "scr-count7" have following parameters [margin, density, distanceWeight, visibilityTestEnabled, visibilityTestThreshold]. First parameter is margin around labels or icons (units are inches). Second parameter is density which defines maximum number of geodata features per square inch. Third parameter defines how much distance affects resulting importance. Fourth parameter enables or disables visibility test (0 - disabled, 1 - enabled). Visibility test means that features which are hidden behind terrain will not be rendered. Fifth parameter sets how far have to be feature behind terrain to be hidden (units are meters). Default values for "scr-count7" are [0.05,999,1,0,1000].

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" ]
		}
    });  
}));