Cloud
Облачный сервис для быстрого и эффективного анализа и визуализации данных для вашего бизнеса без необходимости создания своих приложений и программирования.
Creating Dashboard at Runtime
Наши примеры проектов и шаблоны отчётов помогут Вам разобраться в основах работы с нашими продуктами.A dashboard can be built entirely in code — data, a table element, dimension columns and filters — with no designed template.
In Angular.
How it works. Building the element tree in code is equivalent to designing it visually, so the dashboard renders identically to a template-based one.
In Angular.
import { Component } from "@angular/core";
import { Viewer, Stimulsoft } from "stimulsoft-dashboards-js-angular/viewer";
@Component({
imports: [Viewer],
template: `<sti-viewer [report]="report"></sti-viewer>`
})
export class Example {
report: Stimulsoft.Report.StiReport;
constructor() {
this.report = Stimulsoft.Report.StiReport.createNewDashboard();
var dashboard = this.report.pages.getByIndex(0) as Stimulsoft.Dashboard.Components.StiDashboard;
var dataSet = new Stimulsoft.System.Data.DataSet();
dataSet.readJsonFile("Data/Demo.json");
this.report.regData("Demo", "Demo", dataSet);
this.report.dictionary.synchronize();
var table = new Stimulsoft.Dashboard.Components.Table.StiTableElement();
table.width = 700; table.height = 500; table.name = "Example";
var col = new Stimulsoft.Dashboard.Components.Table.StiDimensionColumn();
col.expression = "Products.ProductName";
table.columns.push(col);
var filter = new Stimulsoft.Data.Engine.StiDataFilterRule();
filter.condition = Stimulsoft.Data.Engine.StiDataFilterCondition.BeginningWith;
filter.path = "Products.ProductID"; filter.value = "1";
table.dataFilters.push(filter);
dashboard.components.add(table);
}
}StiReport.createNewDashboard()+pages.getByIndex(0) as StiDashboard— the dashboard surface to add elements to.StiTableElementwithStiDimensionColumnandStiDataFilterRule— a table, its fields and its filters.
How it works. Building the element tree in code is equivalent to designing it visually, so the dashboard renders identically to a template-based one.