Angular

We don't develop using Angular but we've made an example to help you get started.

Starter kit

As Typescript setups typically involve a number of libraries working together to produce a package that can be served. We've created a starter kit for you to use.

Download starter kit

Once you've downloaded and extracted the ZIP, run the following commands to start it up.

npm i -g @angular/cli
npm i
ng serve

Please give the initial setup some time. It will take a while to download all the dependencies and prepare the Angular app.

The example will load a list of bookmarks for you to select from, and render some point Entities that you can click.

Within the "app.component.ts" file you can edit the parameters to change the initial view to match your own account and data.

ENVIRONMENT.PARAMS = {
    ...ENVIRONMENT.PARAMS,

    // Replace with your accountId, found in your account url.
    // Eg: "https://my-account-id.nextspace.host" would mean "my-account-id" is your ID.
    // The ZIP example will be pointed at a test account.
    accountId: "<REPLACE_ME>",

    // Replace with UAT or PROD for client data.
    // DEV is for Nextspace only data.
    // The ZIP example will be set to DEV until you change it!
    env: Api.EEnv.DEV,

    // Required if your Project View is restricted.
    sessionId: ""
};

const viewer = new Cesium.Viewer("VIEWER");
ViewerUtils.InitViewer({
    viewer: viewer,
    // Set to true if you're seeing default Cesium widgets.
    destroyWidgets: false,
    styleContainer: true,
    nextspaceWidgets: true
})

ViewRenderEngine.Render({
    viewer: viewer,
    bookmarkId: "<REPLACE_ME>",
    viewId: "<REPLACE_ME>",
    // Skip the transition for first bookmark render to avoid flying every page reload!
    skipTransition: true
});