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 Vue.
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 Vue.
<script setup lang="ts">
import { Viewer, Stimulsoft } from 'stimulsoft-dashboards-js-vuejs/viewer'
var report = Stimulsoft.Report.StiReport.createNewDashboard();
var dashboard = report.pages.getByIndex(0) as Stimulsoft.Dashboard.Components.StiDashboard;
var dataSet = new Stimulsoft.System.Data.DataSet();
dataSet.readJsonFile("Data/Demo.json");
report.regData("Demo", "Demo", dataSet);
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);
</script>
<template>
<Viewer :report="report" />
</template>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.