DevExpress Dashboards - Packages, Modules, TypeScript and Angular (v18.2)

Great news for web developers: with v18.2, our Dashboards are first-class citizens of your world, taking full advantage of modules and packages and providing definitions for those of you who prefer TypeScript.

One very common request is to use DevExpress Dashboards in applications created by Angular CLI. We solved this problem by publishing an npm package. Of course you can install this package in any project, using the usual npm or yarn commands. We have run successful tests with several frameworks, including Knockout and Vue.

npm install devexpress-dashboard
... or ...
yarn add devexpress-dashboard

Using Angular

For the Angular use case, a detailed guide is available here. The main step is to create an Angular component for the dashboard, which is made easy by the new package. Here’s a partial code snippet to give you an idea:

import { Component, AfterViewInit, ElementRef } from '@angular/core';
import {
  DashboardControl,
  ResourceManager,
  DashboardPanelExtension } from 'devexpress-dashboard';

...

export class DashboardComponent implements OnInit, AfterViewInit {
  ngAfterViewInit(): void {
    ResourceManager.embedBundledResources();
    var dashboardControl = new DashboardControl(
      this.element.nativeElement.querySelector(".dashboard-container"),  {
        endpoint: "https://demos.devexpress.com/services/dashboard/api",
        workingMode: "Designer"
      });

    dashboardControl.render();
  }

  constructor(private element: ElementRef) { }
}

Note that we consider delivering a standard component in the future. However, we are looking to analyze different projects now that the modular structure is available, to make sure we supply the required set of options and support all important use cases. Please feel free to get in touch and let us know about your scenarios!

TypeScript

The new package contains all the *.d.ts files required for TypeScript, and you can benefit from code completion in your development environment as a result! Of course we fully support .NET Core, so you can even use Macs or Linux machines to create application systems for Dashboards, including frontends and backends.

VS Code on a Mac with Code Completion for Dashboards

Join the Webinar

Sign up for the upcoming “New in v18.2 - Dashboards, Reporting & Data Analytics” webinar where:

  • you’ll see all the new features/tools/components in v18.2
  • you can ask questions and interact with our devs

Click here to register now.

We Would Like To Hear From You!

We try to focus our development efforts in those areas that matter most to you, our customers. Developers have lots of choices these days, which is a good thing - but it also makes our job harder. We would appreciate it very much if you could take the time to submit your responses to the survey below, so we can do an even better job in the future.

2 comment(s)
Miro Mz

Very excited about this one, awesome!

Can we expect to see a better integration and support for all the themes and the new theme builder for dashboards as well?  Only a subset seems to be available now.

When using dashboards as part of a larger app this is a must in order to maintain the same consistent look and feel throughout the entire application.

13 November, 2018
Andrey (DevExpress)

@Miro Mz

Thank you for your feedback, we appreciate it!

We are currently researching our ways to provide better theming in our products.

Could you please specify what you mean under "all the themes and new theme builder"? Am I right that you are referring to DevExtreme's set of predefined themes and their reworked ThemeBuilder ( devexpress.github.io/ThemeBuilder )?

If so, what set of themes are you interested in - Generic, Material themes or both?

And what is your opinion about CLI tools approach in theme building described here - github.com/.../5380 ?

15 November, 2018

Please login or register to post comments.