Differences
This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
dev:viewer:sdk:examples_js:addoverlayobjects [2020/08/03 08:20] jeroen |
dev:viewer:sdk:examples_js:addoverlayobjects [2023/10/04 12:43] (current) pieter |
||
---|---|---|---|
Line 1: | Line 1: | ||
- | ====== Example | + | ====== Example: Adding an Area Overlay Object |
+ | This example demonstrates adding one Area '' | ||
+ | |||
+ | |||
+ | After the workspace opens, a red building footprint is added using '' | ||
< | < | ||
- | | + | <script> |
- | | + | let exampleUrl |
+ | </ | ||
+ | |||
+ | <link rel=" | ||
+ | integrity=" | ||
+ | | ||
- | | + | < |
+ | integrity=" | ||
+ | crossorigin=" | ||
- | var viewer; | + | <span id=" |
+ | <br /> | ||
+ | <br /> | ||
+ | <input type=" | ||
+ | <span id=" | ||
- | var AMap = orbitgt.mapping3d.sdk.viewer.AMap; | + | < |
- | var AList = orbitgt.mapping3d.sdk.viewer.AList; | + | |
- | var Constants = orbitgt.mapping3d.sdk.viewer.Constants; | + | |
- | var SDKViewer = orbitgt.mapping3d.sdk.viewer.SDKViewer; | + | |
- | var CoordinatePath = orbitgt.mapping3d.sdk.viewer.CoordinatePath; | + | |
- | var CoordinatePart = orbitgt.mapping3d.sdk.viewer.CoordinatePart; | + | |
- | var Coordinate = orbitgt.mapping3d.sdk.viewer.Coordinate; | + | |
- | var MapObject = orbitgt.mapping3d.sdk.viewer.MapObject; | + | |
- | var Color = orbitgt.mapping3d.sdk.viewer.Color; | + | |
- | + | ||
- | /** | + | |
- | * Called when the viewer component is ready for interaction. | + | |
- | */ | + | |
- | function handleReady() { | + | |
- | viewer.onWorkspaceOpened.add(handleWorkspaceOpened); | + | |
- | } | + | |
- | /** | + | let toggleShowSource = () => { |
- | * Called when a workspace was opened. | + | |
- | */ | + | element.style.display = element.style.display == ' |
- | | + | } |
- | var part = new CoordinatePart(); | + | fetch(exampleUrl) |
- | part.crs = " | + | .then(response |
- | part.points.add(Coordinate.fromXY(null, | + | .then(text => { |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | part.points.add(Coordinate.fromXY(null, | + | |
- | var path = new CoordinatePath(); | + | |
- | path.crs = " | + | |
- | path.parts.add(part); | + | |
- | | + | |
- | | + | // add example in iframe |
- | | + | let frame = document.createElement(" |
- | | + | frame.style.border |
+ | frame.style.overflow | ||
+ | frame.width = 950; | ||
+ | frame.height | ||
+ | frame.srcdoc = text; | ||
+ | document.getElementById(" | ||
- | var list = new AList(MapObject.TYPE); | + | // add ' |
- | list.add(object); | + | let pre = document.createElement(" |
+ | pre.classList.add(" | ||
+ | | ||
+ | pre.textContent = text; | ||
+ | document.getElementById(" | ||
+ | document.getElementById(" | ||
+ | document.getElementById(" | ||
- | console.log(" | + | // highlight |
+ | hljs.highlightBlock(pre); | ||
- | | + | |
- | | + | |
- | | + | |
- | * Called when the page is full loaded. | + | |
- | */ | + | |
- | function handleDOMReady() { | + | |
- | // Create viewer startup options | + | |
- | var loginOptions = new AMap(); | + | |
- | loginOptions.set(Constants.LOGIN_MODE, | + | |
- | loginOptions.set(Constants.LOGIN_PUBLICATION_PUBLIC_ID, | + | |
- | var options = new AMap(); | + | |
- | options.set(Constants.STARTUP_AUTO_LOGIN, | + | |
- | // Create viewer | + | |
- | var appElement = document.getElementById(" | + | |
- | viewer = new SDKViewer(" | + | |
- | viewer.setSize(1000, | + | |
- | viewer.isReady.then(handleReady); | + | |
- | } | + | |
- | | + | </script> |
- | document.addEventListener(" | + | |
- | </ | ||
- | | ||
</ | </ |
Last modified:: 2020/08/03 08:20