terriajs
Version:
Geospatial data visualization platform.
1,553 lines (849 loc) • 41.8 kB
HTML
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="lang:clipboard.copy" content="Copy to clipboard">
<meta name="lang:clipboard.copied" content="Copied to clipboard">
<meta name="lang:search.language" content="en">
<meta name="lang:search.result.none" content="No matching documents">
<meta name="lang:search.result.one" content="1 matching document">
<meta name="lang:search.result.other" content="# matching documents">
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="../../assets/images/favicon.png">
<meta name="generator" content="mkdocs-0.17.2, mkdocs-material-2.2.3">
<title>Initialization Files - TerriaJS</title>
<link rel="stylesheet" href="../../assets/stylesheets/application.bcabdff3.css">
<script src="../../assets/javascripts/modernizr.1aa3b519.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
</head>
<body>
<svg class="md-svg">
<defs>
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="drawer">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="search">
<label class="md-overlay" data-md-component="overlay" for="drawer"></label>
<header class="md-header" data-md-component="header">
<nav class="md-header-nav md-grid">
<div class="md-flex">
<div class="md-flex__cell md-flex__cell--shrink">
<a href="../.." title="TerriaJS" class="md-header-nav__button md-logo">
<img src="../../terria.png" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
TerriaJS
</span>
<span class="md-header-nav__topic">
Initialization Files
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="search"></label>
<div class="md-search__inner">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" required placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query">
<label class="md-icon md-search__icon" for="search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset"></button>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap" data-md-scrollfix>
<div class="md-search-result" data-md-component="result">
<div class="md-search-result__meta">
Type to start searching
</div>
<ol class="md-search-result__list"></ol>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</nav>
</header>
<div class="md-container">
<main class="md-main">
<div class="md-main__inner md-grid" data-md-component="container">
<div class="md-sidebar md-sidebar--primary" data-md-component="navigation">
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="drawer">
<span class="md-nav__button md-logo">
<img src="../../terria.png" width="24" height="24">
</span>
TerriaJS
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../.." title="Home" class="md-nav__link">
Home
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item md-nav__item--active md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-3" type="checkbox" id="nav-3" checked>
<label class="md-nav__link" for="nav-3">
Customizing
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-3">
Customizing
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../" title="Overview" class="md-nav__link">
Overview
</a>
</li>
<li class="md-nav__item">
<a href="../client-side-config/" title="Client-side Config" class="md-nav__link">
Client-side Config
</a>
</li>
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="toc">
<label class="md-nav__link md-nav__link--active" for="toc">
Initialization Files
</label>
<a href="./" title="Initialization Files" class="md-nav__link md-nav__link--active">
Initialization Files
</a>
<nav class="md-nav md-nav--secondary">
<label class="md-nav__title" for="toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#using-a-catalog-file" title="Using a catalog file" class="md-nav__link">
Using a catalog file
</a>
</li>
<li class="md-nav__item">
<a href="#editing-catalog-files" title="Editing catalog files" class="md-nav__link">
Editing catalog files
</a>
</li>
<li class="md-nav__item">
<a href="#catalog-file-properties" title="Catalog file properties" class="md-nav__link">
Catalog file properties
</a>
<nav class="md-nav">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#corsdomains" title="corsDomains" class="md-nav__link">
corsDomains
</a>
</li>
<li class="md-nav__item">
<a href="#homecamera-and-initialcamera" title="homeCamera and initialCamera" class="md-nav__link">
homeCamera and initialCamera
</a>
<nav class="md-nav">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#option-1-north-south-east-west" title="Option 1: north, south, east, west" class="md-nav__link">
Option 1: north, south, east, west
</a>
</li>
<li class="md-nav__item">
<a href="#option-2-position-direction-and-up" title="Option 2: position, direction and up" class="md-nav__link">
Option 2: position, direction and up
</a>
</li>
<li class="md-nav__item">
<a href="#option-3-positionheading-like-an-aircraft" title="Option 3: positionHeading (like an aircraft)" class="md-nav__link">
Option 3: positionHeading (like an aircraft)
</a>
</li>
<li class="md-nav__item">
<a href="#option-4-lookat-a-feature" title="Option 4: lookAt (a feature)" class="md-nav__link">
Option 4: lookAt (a feature)
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="../server-side-config/" title="Server-side Config" class="md-nav__link">
Server-side Config
</a>
</li>
<li class="md-nav__item">
<a href="../skinning/" title="Skinning" class="md-nav__link">
Skinning
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-4" type="checkbox" id="nav-4">
<label class="md-nav__link" for="nav-4">
Connecting to Data
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-4">
Connecting to Data
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../connecting-to-data/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/cross-origin-resource-sharing/" title="Cross-Origin Resource Sharing" class="md-nav__link">
Cross-Origin Resource Sharing
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-groups/" title="Catalog Groups" class="md-nav__link">
Catalog Groups
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-items/" title="Catalog Items" class="md-nav__link">
Catalog Items
</a>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-4-5" type="checkbox" id="nav-4-5">
<label class="md-nav__link" for="nav-4-5">
Customizing Data Appearance
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="2">
<label class="md-nav__title" for="nav-4-5">
Customizing Data Appearance
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../connecting-to-data/customizing-data-appearance/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/customizing-data-appearance/imagery-data/" title="Imagery Data" class="md-nav__link">
Imagery Data
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/customizing-data-appearance/tabular-data/" title="Tabular Data" class="md-nav__link">
Tabular Data
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/customizing-data-appearance/feature-info-template/" title="Feature Information Template" class="md-nav__link">
Feature Information Template
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-functions/" title="Catalog Functions" class="md-nav__link">
Catalog Functions
</a>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-4-7" type="checkbox" id="nav-4-7">
<label class="md-nav__link" for="nav-4-7">
Catalog Type Details
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="2">
<label class="md-nav__title" for="nav-4-7">
Catalog Type Details
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/abs-itt-dataset-list/" title="ABS ITT (group)" class="md-nav__link">
ABS ITT (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/abs-itt/" title="ABS ITT (item)" class="md-nav__link">
ABS ITT (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/esri-featureServer-group/" title="ArcGIS FeatureServer (group)" class="md-nav__link">
ArcGIS FeatureServer (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/esri-featureServer/" title="ArcGIS FeatureServer (item)" class="md-nav__link">
ArcGIS FeatureServer (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/esri-mapServer-group/" title="ArcGIS MapServer (group)" class="md-nav__link">
ArcGIS MapServer (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/esri-mapServer/" title="ArcGIS MapServer (item)" class="md-nav__link">
ArcGIS MapServer (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/esri-group/" title="ArcGIS Server (group)" class="md-nav__link">
ArcGIS Server (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/bing-maps/" title="Bing Maps (item)" class="md-nav__link">
Bing Maps (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/csw/" title="Catalog Service for the Web (CSW) (group)" class="md-nav__link">
Catalog Service for the Web (CSW) (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/czml/" title="Cesium Language (CZML) (item)" class="md-nav__link">
Cesium Language (CZML) (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/cesium-terrain/" title="Cesium Terrain (item)" class="md-nav__link">
Cesium Terrain (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/ckan/" title="CKAN (group)" class="md-nav__link">
CKAN (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/ckan-resource/" title="CKAN Resource (item)" class="md-nav__link">
CKAN Resource (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/csv/" title="Comma-Separated Values (CSV) (item)" class="md-nav__link">
Comma-Separated Values (CSV) (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/composite/" title="Composite (item)" class="md-nav__link">
Composite (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/ogr/" title="Format Conversion Service (based on OGR) (item)" class="md-nav__link">
Format Conversion Service (based on OGR) (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/geojson/" title="GeoJSON (item)" class="md-nav__link">
GeoJSON (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/gpx/" title="GPX (item)" class="md-nav__link">
GPX (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/group/" title="Group (Manual) (group)" class="md-nav__link">
Group (Manual) (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/kml/" title="Keyhole Markup Language (KML) (item)" class="md-nav__link">
Keyhole Markup Language (KML) (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/open-street-map/" title="OpenStreetMap (item)" class="md-nav__link">
OpenStreetMap (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/places-like-me-function/" title="Places Like Me (function)" class="md-nav__link">
Places Like Me (function)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/sdmx-json/" title="SDMX-JSON (item)" class="md-nav__link">
SDMX-JSON (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/sos/" title="Sensor Observation Service (SOS) (item)" class="md-nav__link">
Sensor Observation Service (SOS) (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/socrata/" title="Socrata (group)" class="md-nav__link">
Socrata (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/spatial-detailing-function/" title="Spatial Detailing (function)" class="md-nav__link">
Spatial Detailing (function)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/terria-json/" title="TerriaJS JSON (function)" class="md-nav__link">
TerriaJS JSON (function)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/url-template/" title="URL Template (item)" class="md-nav__link">
URL Template (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/wfs-getCapabilities/" title="Web Feature Service (WFS) (group)" class="md-nav__link">
Web Feature Service (WFS) (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/wfs/" title="Web Feature Service (WFS) (item)" class="md-nav__link">
Web Feature Service (WFS) (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/wms-getCapabilities/" title="Web Map Service (WMS) (group)" class="md-nav__link">
Web Map Service (WMS) (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/wms/" title="Web Map Service (WMS) (item)" class="md-nav__link">
Web Map Service (WMS) (item)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/wps/" title="Web Processing Service (WPS) (function)" class="md-nav__link">
Web Processing Service (WPS) (function)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/wps-getCapabilities/" title="Web Processing Service (WPS) (group)" class="md-nav__link">
Web Processing Service (WPS) (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/wfs-features-group/" title="WFS Features (group)" class="md-nav__link">
WFS Features (group)
</a>
</li>
<li class="md-nav__item">
<a href="../../connecting-to-data/catalog-type-details/why-am-i-special-function/" title="Why Am I Special (function)" class="md-nav__link">
Why Am I Special (function)
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-5" type="checkbox" id="nav-5">
<label class="md-nav__link" for="nav-5">
Deploying
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-5">
Deploying
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../deploying/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
<li class="md-nav__item">
<a href="../../deploying/deploying-terriamap/" title="Deploying TerriaMap" class="md-nav__link">
Deploying TerriaMap
</a>
</li>
<li class="md-nav__item">
<a href="../../deploying/deploying-to-aws/" title="Deploying to AWS" class="md-nav__link">
Deploying to AWS
</a>
</li>
<li class="md-nav__item">
<a href="../../deploying/deploying-with-kubernetes/" title="Deploying with Kubernetes" class="md-nav__link">
Deploying with Kubernetes
</a>
</li>
<li class="md-nav__item">
<a href="../../deploying/setting-up-a-region-mapping-server/" title="Setting Up a Region Mapping Server" class="md-nav__link">
Setting Up a Region Mapping Server
</a>
</li>
<li class="md-nav__item">
<a href="../../deploying/setting-up-geoserver/" title="Setting Up Geoserver" class="md-nav__link">
Setting Up Geoserver
</a>
</li>
<li class="md-nav__item">
<a href="../../deploying/using-as-a-ckan-previewer/" title="Using as a CKAN Previewer" class="md-nav__link">
Using as a CKAN Previewer
</a>
</li>
<li class="md-nav__item">
<a href="../../deploying/controlling-with-url-parameters/" title="Controlling with URL Parameters" class="md-nav__link">
Controlling with URL Parameters
</a>
</li>
<li class="md-nav__item">
<a href="../../deploying/controlling-in-an-iframe-or-popup/" title="Controlling in an <iframe> or Popup" class="md-nav__link">
Controlling in an <iframe> or Popup
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Contributing
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Contributing
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../contributing/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
<li class="md-nav__item">
<a href="../../contributing/development-environment/" title="Development Environment" class="md-nav__link">
Development Environment
</a>
</li>
<li class="md-nav__item">
<a href="../../contributing/architecture/" title="Architecture" class="md-nav__link">
Architecture
</a>
</li>
<li class="md-nav__item">
<a href="../../contributing/using-a-custom-version-of-cesium/" title="Using a Custom Version of Cesium" class="md-nav__link">
Using a Custom Version of Cesium
</a>
</li>
<li class="md-nav__item">
<a href="../../contributing/setting-up-saucelabs/" title="Setting up Saucelabs" class="md-nav__link">
Setting up Saucelabs
</a>
</li>
<li class="md-nav__item">
<a href="../../contributing/problems-and-solutions/" title="Problems and Solutions" class="md-nav__link">
Problems and Solutions
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-sidebar md-sidebar--secondary" data-md-component="toc">
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--secondary">
<label class="md-nav__title" for="toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#using-a-catalog-file" title="Using a catalog file" class="md-nav__link">
Using a catalog file
</a>
</li>
<li class="md-nav__item">
<a href="#editing-catalog-files" title="Editing catalog files" class="md-nav__link">
Editing catalog files
</a>
</li>
<li class="md-nav__item">
<a href="#catalog-file-properties" title="Catalog file properties" class="md-nav__link">
Catalog file properties
</a>
<nav class="md-nav">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#corsdomains" title="corsDomains" class="md-nav__link">
corsDomains
</a>
</li>
<li class="md-nav__item">
<a href="#homecamera-and-initialcamera" title="homeCamera and initialCamera" class="md-nav__link">
homeCamera and initialCamera
</a>
<nav class="md-nav">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#option-1-north-south-east-west" title="Option 1: north, south, east, west" class="md-nav__link">
Option 1: north, south, east, west
</a>
</li>
<li class="md-nav__item">
<a href="#option-2-position-direction-and-up" title="Option 2: position, direction and up" class="md-nav__link">
Option 2: position, direction and up
</a>
</li>
<li class="md-nav__item">
<a href="#option-3-positionheading-like-an-aircraft" title="Option 3: positionHeading (like an aircraft)" class="md-nav__link">
Option 3: positionHeading (like an aircraft)
</a>
</li>
<li class="md-nav__item">
<a href="#option-4-lookat-a-feature" title="Option 4: lookAt (a feature)" class="md-nav__link">
Option 4: lookAt (a feature)
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-content">
<article class="md-content__inner md-typeset">
<h1>Initialization Files</h1>
<p>A catalog in TerriaJS is defined in one or more "initialization files" (or init files). In a default TerriaMap installation, the main init file is found in <code>wwwroot/init/terria.json</code>.</p>
<p>An init file is a <a href="https://en.wikipedia.org/wiki/JSON">JSON file</a> with this basic structure:</p>
<pre><code>{
"catalog": [
{
"type": "group",
"name": "My group",
"items": [
...
]
},
...
],
"homeCamera": {
"north": -8,
"east": 158,
"south": -45,
"west": 109
},
"initialCamera": { ... },
"corsDomains": [ "myserver.gov.au" ]
}
</code></pre>
<p>Key points:</p>
<ul>
<li><code>catalog</code> is an array.</li>
<li>Every element of that array must have a <code>type</code> (corresponding to a value recognised by TerriaJS) and a <code>name</code>.</li>
<li>The three major categories of catalog member types are:<ul>
<li><a href="../../connecting-to-data/catalog-groups/">Catalog Group</a>: A group (folder) of items. Different group types allow the contents to be manually specified or to be automatically determined by querying various types of server.</li>
<li><a href="../../connecting-to-data/catalog-items/">Catalog Item</a>: Actual geospatial or chart data from a file or service, in various formats.</li>
<li><a href="../../connecting-to-data/catalog-functions/">Catalog Function</a>: A parameterized service, such as a Web Processing Service (WPS). The user supplies the parameters and gets back some result.</li>
</ul>
</li>
</ul>
<p>Most of the other properties of each layer depend on the specific type. See the links above for details of each type.</p>
<h3 id="using-a-catalog-file">Using a catalog file</h3>
<p>There are four ways to load a catalog file into a TerriaJS application:</p>
<ol>
<li>Store it in Terria Map's <code>wwwroot/init</code> directory, and refer to it in the <code>initializationUrls</code> section of the <a href="../client-side-config/"><code>config.json</code></a> file. It is loaded automatically when you visit the webpage. This is how <code>wwwroot/init/terria.json</code> is loaded in the default TerriaMap setup.</li>
<li>Store it in Terria Maps's <code>wwwroot/init</code> directory, without adding it to config.json. Add the catalog file name (without <code>.json</code>) to the URL after <code>#</code>. For instance, <code>example.com/terria#mycatalog</code>. See <a href="../../deploying/controlling-with-url-parameters/">Controlling with URL Parameters</a> for more information. This method is useful when developing a catalog that is not quite ready for public access, but it is helpful to show it to interested stakeholders.</li>
<li>Store it anywhere on the web (on a <a href="../../connecting-to-data/cross-origin-resource-sharing/">CORS-enabled</a> server). Add the complete URL (including <code>.json</code>) to the URL, after <code>#</code>. For instance, <code>http://nationalmap.gov.au/#http://example.com/mycatalog.json</code>. This method is useful when developing services for a TerriaJS instance which you don't directly control, and for rapidly previewing changes which you can also share with people.</li>
<li>Store it locally, then drag and drop it into the Terria Map window.</li>
</ol>
<p>All catalog files, however loaded, are merged together in TerriaJS. Any two items with the same name and place in the tree are combined. This means that if two catalog files each define a group called "Water", there will be only one "Water" group in Terria, containing the two sets of group members merged together.</p>
<h3 id="editing-catalog-files">Editing catalog files</h3>
<p>Catalog files can be edited three ways:</p>
<ol>
<li>Using a desktop text editor. Be very careful to ensure that your file is valid JSON. This is more restrictive format than simple JavaScript, for instance. You can use <a href="http://jsonlint.com/">http://jsonlint.com/</a>.</li>
<li>Using a JSON-specific editor, such as <a href="http://www.jsoneditoronline.org/">http://www.jsoneditoronline.org/</a>. This has the advantage that your file will be valid JSON.</li>
<li>Using the TerriaJS Catalog Editor, currently available in a preview version at <a href="http://terria.io/DataSourceEditor/">http://terria.io/DataSourceEditor/</a>. This editor is not yet considered reliable, and may cause data corruption.</li>
</ol>
<h2 id="catalog-file-properties">Catalog file properties</h2>
<h3 id="corsdomains"><code>corsDomains</code></h3>
<p>By default, TerriaJS proxies all requests within the proxy whitelist specified in the <a href="../server-side-config/">Server-side Config</a>, making the assumption that the servers do not support CORS. You can add hosts that are known to support CORS to this property to avoid proxying them.</p>
<p><code>"corsDomains": [ "myserver.gov.au" ]</code></p>
<p>See <a href="../../connecting-to-data/cross-origin-resource-sharing/">Cross-Origin Resource Sharing</a> for more information.</p>
<h3 id="homecamera-and-initialcamera"><code>homeCamera</code> and <code>initialCamera</code></h3>
<p>Maps have two camera positions, <code>homeCamera</code> and <code>initialCamera</code>. They are specified identically. All the examples here use <code>homeCamera</code>, but apply equally to both.</p>
<ul>
<li><code>initialCamera</code>: the location when the map first displays</li>
<li><code>homeCamera</code>: where the camera goes when you click the "home" button between the zoom-in and zoom-out buttons.</li>
</ul>
<h4 id="option-1-north-south-east-west">Option 1: <code>north</code>, <code>south</code>, <code>east</code>, <code>west</code></h4>
<p>The bounding box method uses <code>north</code>, <code>east</code>,<code>south</code>, and <code>west</code>, in lat/lng decimal degrees. The camera will be positioned in the center point of those bounds, looking toward the Earth's center, zoomed back enough to see to the edges of the bounds.</p>
<p>This is the only mode supported in 2D mode (Leaflet). Therefore, you should always include a bounding box, even if you also use another mode.</p>
<pre><code>"homeCamera": {
"north": -8,
"east": 158,
"south": -45,
"west": 109
}
</code></pre>
<h4 id="option-2-position-direction-and-up">Option 2: <code>position</code>, <code>direction</code> and <code>up</code></h4>
<p>This overrides Option 1.</p>
<p>You can specify <code>position</code>, <code>direction</code>, and <code>up</code> (as well as
<code>north</code>, <code>east</code>,<code>south</code>, and <code>west</code>). <code>position</code>, <code>direction</code> and <code>up</code>
need <code>x</code>, <code>y</code> and <code>z</code> keys specifying locations in
<a href="https://en.wikipedia.org/wiki/ECEF">ECEF</a> metre coordinates, which
means the origin is the centre of the Earth, positive Z points to
the north pole, positive X points toward
<a href="https://en.wikipedia.org/wiki/Null_Island">"Null Island"</a> where the
equator intersects with 0 degrees longitude, and positive Y points at
(0, 90E) -- which is in the Indian Ocean south of the Bay of Bengal.</p>
<ul>
<li><code>position</code>: where the camera is</li>
<li><code>direction</code>: where the camera is looking</li>
<li><code>up</code>: which way is "up", which determines how the camera is rotated</li>
</ul>
<p>For most purposes positioning this way is difficult for normal
humans. To see an example, move the camera to some location, click the "share" button (and choose to not use the
URL shortner), then URL-decode the URL you get.</p>
<pre><code>"homeCamera": {
"west": 105.51019777628066,
"south": -39.61110094535454,
"east": 161.48980219597954,
"north": -9.09249015267353,
"position": {
"x": -6685409.955422118,
"y": 7044952.140379313,
"z": -4828130.30167422
},
"direction": {
"x": 0.6155666547559182,
"y": -0.6486719065674744,
"z": 0.4475516184561574
},
"up": {
"x": -0.30807420442344124,
"y": 0.3246424737331665,
"z": 0.8942580996654569
}
}
</code></pre>
<h4 id="option-3-positionheading-like-an-aircraft">Option 3: <code>positionHeading</code> (like an aircraft)</h4>
<p>Setting <code>positionHeading</code> is useful for when you're showing a view from an aircraft or
satellite, and overrides Options 1 and 2.</p>
<p>It has the following attributes:</p>
<ul>
<li><code>cameraLongitude</code>: longitude of camera</li>
<li><code>cameraLatitude</code>: latitude of camera</li>
<li><code>cameraHeight</code>: height of camera above earth's surface, probably in metres</li>
<li><code>heading</code>: in degrees clockwise from north (90 is east)</li>
<li><code>pitch</code>: how much the camera is tilted, in degrees down from horizontal (-90 is straight down)</li>
<li><code>roll</code>: how much the camera is rotated left or right, in degrees</li>
</ul>
<pre><code>"homeCamera": {
"positionHeading": {
"cameraLongitude": 145,
"cameraLatitude": -37,
"cameraHeight": 1000,
"heading": 0,
"pitch": -70,
"roll": 0,
}
}
</code></pre>
<h4 id="option-4-lookat-a-feature">Option 4: <code>lookAt</code> (a feature)</h4>
<p><code>lookAt</code> is probably the most useful one for showing a feature on the
map, and overrides Options 1, 2, and 3.</p>
<p>It has these attributes:</p>
<ul>
<li><code>targetLongitude</code>: The longitude to look at</li>
<li><code>targetLatitude</code>: The latitude to look at</li>
<li><code>targetHeight</code>: in meters above the WGS84 ellipsoid (positive is up)</li>
<li><code>heading</code>: in degrees clockwise from north</li>
<li><code>pitch</code>: in degrees down from horizontal (so negative values mean you're looking at the sky)</li>
<li><code>range</code>: in meters from the thing you're looking at</li>
</ul>
<pre><code>"homeCamera": {
"lookAt": {
"targetLongitude": 145,
"targetLatitude": 37,
"targetHeight": 0,
"heading": 0,
"pitch": -90,
"range": 1000,
}
}
</code></pre>
</article>
</div>
</div>
</main>
<footer class="md-footer">
<div class="md-footer-nav">
<nav class="md-footer-nav__inner md-grid">
<a href="../client-side-config/" title="Client-side Config" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
Previous
</span>
Client-side Config
</span>
</div>
</a>
<a href="../server-side-config/" title="Server-side Config" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
Next
</span>
Server-side Config
</span>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-forward md-footer-nav__button"></i>
</div>
</a>
</nav>
</div>
<div class="md-footer-meta md-typeset">
<div class="md-footer-meta__inner md-grid">
<div class="md-footer-copyright">
powered by
<a href="http://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
</div>
</div>
</footer>
</div>
<script src="../../assets/javascripts/application.6cdc17f0.js"></script>
<script>app.initialize({version:"0.17.2",url:{base:"../.."}})</script>
</body>
</html>