Cesium applications made awesome with TerriaJS
This is a modal window.
The media could not be loaded, either because the server or network failed or because the format is not supported.
Formal Metadata
| Title |
| |
| Title of Series | ||
| Number of Parts | 295 | |
| Author | ||
| Contributors | ||
| License | CC Attribution 3.0 Germany: You are free to use, adapt and copy, distribute and transmit the work or content in adapted or unchanged form for any legal purpose as long as the work is attributed to the author in the manner specified by the author or licensor. | |
| Identifiers | 10.5446/43484 (DOI) | |
| Publisher | ||
| Release Date | ||
| Language |
Content Metadata
| Subject Area | ||
| Genre | ||
| Abstract |
| |
| Keywords |
00:00
Online chatInheritance (object-oriented programming)Loop (music)VolumenvisualisierungFunction (mathematics)Term (mathematics)Level (video gaming)Open setLibrary (computing)Inheritance (object-oriented programming)BuildingUsabilityTwin primeDigitizingCartesian coordinate systemOpen sourceError messageOperator (mathematics)Multiplication signFluid staticsMappingSocial classComputing platformVisualization (computer graphics)Content (media)Dynamical systemVery-high-bit-rate digital subscriber lineComputer chessTesselationGoodness of fitMathematicsElectronic mailing listCuboidWeb 2.0Server (computing)Expert systemFile formatWave packetAreaLocal ringSpreadsheetNetwork topologyView (database)Digital photographyEndliche ModelltheorieWebsiteInterface (computing)CausalityUser interfaceMobile WebSet (mathematics)Service (economics)Data conversionComputer fileCombinational logicTablet computerDifferent (Kate Ryan album)TouchscreenHeegaard splittingFunctional (mathematics)1 (number)Right angleConnected spaceProof theoryDemo (music)SoftwareGraph (mathematics)DemosceneWeb servicePoint cloudWeb browserTime seriesDescriptive statisticsMoment (mathematics)Medical imagingTheory of relativityGeometryAddress spaceGroup actionMereologyBitAsynchronous Transfer ModeEmailStructural loadShape (magazine)Raster graphicsVector spaceLibrary catalogPoint (geometry)Loop (music)VolumenvisualisierungPlanningOcean currentLecture/ConferenceMeeting/Interview
06:16
Term (mathematics)State of matterTwin primeDigital signalCodePrototypeAuthorizationAuthenticationOnline chatDenial-of-service attackCodeCubeInformationService (economics)Open setOcean currentSoftware repositoryCartesian coordinate systemSelf-organizationDemo (music)PrototypeAuthorizationMereologyAuthenticationEndliche ModelltheorieLevel (video gaming)Twin primeState of matterLibrary catalogDigitizingAreaDifferent (Kate Ryan album)Client (computing)Web 2.0Factory (trading post)ChainMoving averageLecture/Conference
12:25
Dependent and independent variablesService (economics)Endliche ModelltheorieLogicDebuggerSoftware testingBitServer (computing)Computer fileFiber bundleLecture/Conference
13:08
Endliche ModelltheorieFunctional (mathematics)DebuggerMobile appLecture/Conference
13:47
Mobile appParity (mathematics)Server (computing)Multiplication signBranch (computer science)ExpressionLecture/Conference
Transcript: English(auto-generated)
00:07
And I'm Steven Davies from the Terrier team at CSIRO's Data61. So what's CSIRO? CSIRO is Australia's national science research agency.
00:20
And over the last 100 years or so of its operation, it's been responsible for many global innovations. And a few of them are listed, such as dealing with signal reverberation off walls to allow for high-speed indoor Wi-Fi, polymer or plastic banknotes, and insect repellent called Aeroguard.
00:44
So what's cesium.js? Cesium.js is an open-source JavaScript library for world-class 3D globes and maps. Our mission is to create the leading 3D globe and map for static and time-dynamic content with the best possible performance, precision, visual quality, platform support, community,
01:03
and ease of use. And that's taken from the cesium.js website. Here's an example of cesium being used to render the New York skyline from open street map data using 3D tiles. Terrier.js is a library for building rich,
01:21
web-based geospatial data explorers. It's fully open source and built on top of cesium and Leaflet for mapping, D3 for charting, and React for the user interface. So why should you use Terrier.js? The Terrier.js library includes many features out of the box, including a data catalog UI
01:40
for listing, viewing metadata, previewing, and adding data sets to the map, a workbench to show legends prominently beside the map, wide format support for raster layers from expert geographic information systems such as ArcGIS server, WMS, WMTS, TMS,
02:02
open street map, and more, and vector layers too, from KML, GeoJSON, ArcGIS server, WFS, and more. Another feature is region mapping, which makes it easy to create visualizations from Excel spreadsheets, where a column indicates region data
02:22
such as a local government area or postcode. Time series charts let us see how things change with time, such as the power generation of two power stations shown here over the last seven days.
02:41
It also has great support for 3D terrain, models derived from area of photography and photogrammetry, point clouds, and more, and it has a mobile interface designed to make Terrier work well on mobile phones and tablets.
03:04
It has a split screen view, which lets you visually compare different data sets at different times. Here we're looking at an area west of Melbourne in November 1999 on the left, and a year ago on the right. It also includes a story builder
03:21
that allows you to capture scenes involving data sets, feature info, graphs, and or the splitter, and a short title, description, and pictures to each. You can then share this story with others. It also includes the ability for users to add their own data to the map, either from locally via file or via web service,
03:46
and a 2D leaflet fallback for browsers unable to run WebGL fast enough for Cesium with wide format support. And here are some extra reasons. It has a cute map loading gif on startup.
04:01
It pauses the Cesium render loop when no changes to data occur, which is especially useful on mobile devices for conserving battery. It loads Cesium in a few JS chunks as needed for functionality. It's super easy to create your own map, and you should be able to create one within about 30 minutes with your own catalog.
04:21
The UI is optional. You can use all of it, parts of it, or none. And there's a solid community. You can chat to us on our GitHub chat, and we'll get back, or other people in our community using the open source library will get back to you to help. Or there's also a Google Groups or an email address.
04:44
Architecturally, it looks a bit like this. It's very heavily front-end, allowing for visualization of most supported user-supplied data without sending anything outside the browser. And you can even run Teri.js without the Teri.js server part. You just won't be able to view data sets that don't have cores enabled.
05:02
You won't be able to view things like shape files, which there's a conversion service to convert them to GeoJSON, and you won't be able to share things. Since National Map, which was the first map we built with Teri.js, there have been more than 20 applications built
05:21
by both our team at Data61 and others. Teri.js has enabled each of these agencies to curate the combination of data and functionalities they need to support their users. And on the left is a list of ones that we've made, non-full, and on the right, a list of ones that other people have made
05:41
using the open-source software. I was planning on giving a live demo of New South Wales' digital twin, but as it's still a proof of concept, there hasn't been much work done on UX over a slower connection. But here's a screenshot where you can see the proposed and current 3D strata plans in the city of Penrith with models of trees
06:01
and some underground visualization where the terrain has been peeled back on the right to see underground car parks and pipes. And I have a short demo using central images to tell a story using story mode. And it's based on WMS services
06:21
created by the Open Data Cube. There's the cute GIF spinner. Oh, this isn't on, if it loads.
07:26
Maybe I'll come back to that. Oh, there it comes.
07:57
All right, so I've made a quick story of using some central imagery
08:03
about some flooding in Queensland in early March 2018. When it loads, it looks like it's not working very well.
08:44
I shall continue, as is the problem with live demos. Yeah, all the features for Terrier.js
09:02
and ways to contact us and other information is available at terrier.io. And all of our code is in the Terrier.js organization and most of it in the Terrier.js repo.
09:27
You can contact us on our GitHub chat and usually reply or someone from the community pretty quickly. And our roadmap, where is Terrier.js going?
09:42
Currently we are refactoring a large part of the code base. We've been publishing applications for about five years and the age of our model layer is beginning to show. So we're refactoring a large part of the model layer
10:00
so that we can add more capabilities in the future. But we're very soon releasing a prototype map powered by the refactored code to some clients. And also we'll be adding authentication and role-based authorization to show different catalogs to different users. And other than that, we'll be creating more digital twins
10:21
for other Australian states and possibly some other customers in Asia and working towards an Australian national digital twin.
11:01
Unfortunately that doesn't look like it's gonna work. Oh, there we go.
11:30
Very well. Does anyone have any questions while it loads?
11:42
Half of it. I'll start it from this one.
12:17
Yeah, yeah, go ahead. So how create the ReactJS UI
12:23
and then use just the other parts? Okay, well the server side,
12:40
you wouldn't have to change much on the server side. The server side just serves JS files, JS bundle files and has a few services that the front end uses. There is some logic in the UI, but most of it's in the model layer. And so just like all the buttons
13:02
have a little bit of logic to call things within the model layer. So you would have to re-implement the whole UI and all the functions. But yeah, it's still. So for example, in 2016, we, yeah, 2016,
13:23
we took out our KnockoutJS front end UI and replaced it with ReactJS without changing much of the model layer behind it.
13:44
Yeah, yeah, probably, yeah, we'll be releasing an app in October. So full feature parity, probably sometime the end of this year, between the new one and master.
14:24
Yeah, so just repeating that. Yeah, it is available, we're developing it in the open on the MobX branch. All of our issues about building it are also just in GitHub available to everyone.
14:40
Yeah, I don't think it's gonna work.