The following example creates a custom ASP.NET Core “Moving Average” indicator (when using DevExpress BI Dashboard):
- Create a ChartCustomIndicator descendant (the
MovingIndicatorclass in this example).MovingIndicatoraccepts a collection of data points, evaluates values, and returns resulting points. These points are used to draw the indicator. - Register
MovingIndicatorin IndicatorFactory to make it available as an indicator type. Call the Register method in your application before you save and load a dashboard (to serialize and deserialize the indicator within the dashboard’s XML). - Register ChartIndicatorsExtension before the control is rendered to add the
MovingIndicatortype to the Trend Indicators editor. - Create an instance of
MovingIndicatorand specify desired indicator settings. - Once you launch the application, open the Trend Indicators editor and add the new "Moving Average" indicator type.
Files to Review
Documentation
Does this example address your development requirements/objectives?
(you will be redirected to DevExpress.com to submit your response)
Example Code
trend-indicators/Program.cs
C#using DevExpress.AspNetCore;
using DevExpress.DashboardAspNetCore;
using DevExpress.DashboardWeb;
using Microsoft.Extensions.FileProviders;
using asp_net_core_dashboard_control_trendline_indicators;
using Microsoft.AspNetCore.Builder;
using Microsoft.Extensions.Configuration;
using System;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Hosting;
var builder = WebApplication.CreateBuilder(args);
IFileProvider fileProvider = builder.Environment.ContentRootFileProvider;
IConfiguration configuration = builder.Configuration;
// Add services to the container.
builder.Services.AddControllersWithViews();
builder.Services.AddRazorPages();
builder.Services.AddDevExpressControls();
builder.Services.AddScoped<DashboardConfigurator>((IServiceProvider serviceProvider) => {
return DashboardUtils.CreateDashboardConfigurator(configuration, fileProvider);
});
var app = builder.Build();
// Configure the HTTP request pipeline.
if(!app.Environment.IsDevelopment()) {
app.UseExceptionHandler("/Home/Error");
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseDevExpressControls();
app.UseRouting();
app.UseAuthorization();
app.MapRazorPages();
app.MapDashboardRoute("dashboardControl", "DefaultDashboard");
app.Run();
trend-indicators/Data/MovingIndicator.cs
C#using DevExpress.DashboardCommon;
using DevExpress.DashboardCommon.ViewerData;
using System.Collections.Generic;
namespace asp_net_core_dashboard_control_trendline_indicators.Data {
public class MovingIndicator : ChartCustomIndicator {
protected override Dictionary<AxisPoint, object> Calculate(Dictionary<AxisPoint, decimal?> values) {
var items = new Dictionary<AxisPoint, object>(values.Count);
var sum = decimal.Zero;
var count = 0;
foreach(KeyValuePair<AxisPoint, decimal?> point in values) {
if(count == 0) {
items.Add(point.Key, null);
} else {
items.Add(point.Key, sum / count);
}
sum += point.Value ?? 0;
count++;
}
return items;
}
}
}
trend-indicators/Pages/_Layout.cshtml
Razor<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>Dashboard Web Application</title>
<link href="css/site.min.css" rel="stylesheet" />
<script type="text/javascript">
function onBeforeRender(dashboardControl) {
dashboardControl.registerExtension(new DevExpress.Dashboard.DashboardPanelExtension(dashboardControl, { dashboardThumbnail: "./DashboardThumbnail/{0}.png" }));
dashboardControl.registerExtension(new DevExpress.Dashboard.Designer.ChartIndicatorsExtension(dashboardControl, {
customIndicatorTypes: [
{
type: 'MovingIndicator',
displayName: 'Moving Average'
}
]
}));
}
</script>
</head>
<body>
@RenderBody()
<script src="js/site.min.js"></script>
</body>
</html>