Author: Tim Crawford
We continue to tell you about the main tool of visualization and analytics data – the report designer. In the last article, you learned about the Gauge element. Now, it’s time to consider the next dashboard element – Online map.

Online map

This element allows you to display any geographic object on the bing online map. It includes 3 modes of work - Location, Latitude, Longitude, and GIS.

For example, you want to display all car dealers in Europe. At the same time, you’d like to specify separate geographic objects, designate them with some icons and define their color, add them a certain color and specify the number of sold cars in each country.

The Online map element will assist you to make it. To do this, you should correctly apply three modes of the element. This is what we’re going to tell you about.
location

Location

This mode allows you to specify data fields with positions of geographic objects. You can specify the name of a country, city, region, etc. Besides, you can display your data, for example, the number of car dealers as charts, bubbles, or just numbers. To do this, you should select the display mode of values. Here are five of them:

  • Value;
  • Chart;
  • Bubble;
  • Icon;
  • Heatmap.
You should especially take note of the Heatmap mode. It can be used to highlight the largest and smallest values of geographic objects. On the map of Europe, the country with the largest number of car dealers will be highlighted with one color (brighter), and those countries where there are less of them with another color (dimmer). Thus, it is possible to show the number of car dealers in each country visually.

heatmap
provider
In addition, this mode allows you to select a culture.

In other words, you can select a localization language for your map. To do this, you should select a suitable item from the list (in the example en-us was selected, i.e English (United States), and all geographic objects will be displayed in a language of a selected culture. The list of cultures is quite wide and includes several dozens of localization variants of map objects.

Latitude and Longitude

This mode allows you to display the geographic position of an object on a map. Let's take the case of car dealers where we need to display all of them on the map of Europe. To do this, you should just specify their latitude and longitude, and they will be shown on the map.

lat and long

In addition, you can display your data and geographic objects in different ways just like in the Location mode. Unlike the Location mode, here it’s possible to use only Icon and Heatmap.

GIS mode

If you want to show separate geometric objects on a map, you should use the GIS mode. Objects are drawn using points, lines, and polygons.

gis
map
In turn, in this mode in the Provider point you can select a map type that you need. It's worth noting that the choice here is quite wide - among the types available by default you will find:

  • Open Street Map;
  • Wikimapia;
  • Bing;
  • Google and more.

Examples of using the Online map element

So, let’s take a look at several dashboards in which the element is used.
power

Nuclear power in the United States

The dashboard shows nuclear power stations of the USA and a comparison of electricity production and growth of nuclear power capacity of this country over the last 60 years. Due to this dashboard, it’s possible to visualize the development of nuclear power in the United States and compare it with other kinds of electricity production.

activity

Health Activity

In addition to indicators such as:
  • the number of calories burned;
  • the number of steps taken;
  • daily activity.


This dashboard also contains a GPS navigator created using the online map. It allows you to track the route while jogging or walking and explore an area.

statistics

User Statistics

This dashboard allows you to know the location of your website or product users; this way, you’ll see where your main audience is located and in what countries you’re most popular. Besides, you can see who watches you more, male or female, and find out the total number of users.

computer

Tesla On-Board Computer

The dashboard for Tesla Model S fans is an on-board computer of the worldwide famous electric car. Here you’ll find a lot of measuring indicators - speed, temperature, time, battery charge level, etc. However, its main peculiarity was made using the Online map element – GPS navigator, which tracks and makes a route for the car and allows you to determine its current location.
You can read about how to create a dashboard with the Online Map element in the documentation.

Next time we’ll tell you about the Indicator dashboard element. If you have any questions regarding this article, please This email address is being protected from spambots. You need JavaScript enabled to view it.. We will be glad to help you.
Author: Anrdew Savin
We’re glad to inform you about the release of the new version of data visualization and analytics tools – Stimulsoft Reports and Dashboards! Among basic new features, we would like to highlight a new product for creating dashboards in Blazor applications, a new graphical library for .NET Core components, the GraphQL data adapter, Ribbon chart, and much more.

New product – Stimulsoft Dashboards.BLAZOR

We announce the release of a new product – Stimulsoft Dashboards.BLAZOR. This is a cross-platform solution of data analytics created to integrate the application that works using the Blazor framework. Our product works both on the server (Blazor Server) and client (Blazor WebAssembly) sides. You may quickly integrate it into any web project. It allows you to display and analyze information from many data sources and has a wide range of components to design dashboards. Also, we have added an ability to save a project with dashboards from the Publish wizard to quickly integrate Stimulsoft components into a Blazor application. This product is available with Stimulsoft Dashboards.WEB subscription.

Stimulsoft Dashboards.BLAZOR

New graphics library

We have created the Stimulsoft.Drawing – an independent interface of displaying graphical objects for .NET Core components with various versions of framework - .NET Standard 2.1, .NET Core 3.1, .NET 5.0, .NET 6.0. This library is also suitable for Blazor components. The GDI+ library is compatible with .NET Core components in the Windows operating system and libgdiplus - Mono Project in other OS. Very often, some difficulties could arise with displaying graphics. Using the Stimulsoft.Drawing library, the display of graphics in your application won’t depend on an operating system. This library is included in the NuGet package of Blazor and .NET Core components. At the same, we left the option to switch to using the system GDI+ library.

New graphics library

Compilation for Blazor

The support of the compilation mode to render reports when using the Blazor Server platform is added to the new version. Now you can use all features of the report generator – runtime compilation, functions, publishing reports as classes. Compilation is available on all supported operating systems.

Compilation for Blazor

GraphQL data adapter

Starting with the 2022.3 release, you can get data from various data stores using the GraphQL query model. This data source type has a number of advantages over REST or SQL queries. You should select the GraphQL point from the REST tab in the New Data Source window, specify the URL to a data store, and query text. After getting data, you can create them based on reports and dashboards.
GraphQL

Ribbon Chart

Another feature of the current release concerns the sphere of analysis and display of data - Ribbon Chart. This chart type is an improved version of the Stacked Column chart. First, values for each argument are sorted from largest to smallest, i.e., the maximum value is always displayed topmost. It considerably improves analysis and visual perception of the values of a particular argument. Second, a curve is drawn between the values of the arguments (this is a ribbon), which allows you to estimate the tendencies and trends of indicators when analyzing visually. Try it yourself. The chart is available in reports and dashboards, and you may find it in the Histogram category. In addition, we have added an ability to apply conditional formatting for the Range chart type.

Ribbon Chart

New features for the Tooltip

We have added an ability to visually design the Tooltip element when hovering the cursor for some dashboard elements – Chart, Region Map, Indicator. Tooltips are customized in the Style Designer using properties: Tooltip Brush, Tooltip Text Brush, Tooltip Corner Radius, and Tooltip Border. Now you can design tooltips for your dashboards according to your corporate company style or visual settings of dashboard elements. By the way, there is no separate property that sets the transparency of the tooltip background. But you can set it by specifying the alpha parameter in the color code for the Tooltip Brush property.

Tooltips

New features of the Pivot Table

We have added several new features for the Pivot Table in dashboards. First, you can now sort rows and columns in ascending or descending directions. You can do this using the Sort property in the properties panel for the corresponding data fields. Second, you can define an expanded row or column condition when you use drill-down data. The condition to expand rows or columns is carried out in the Expand property editor in the properties panel.

Pivot Table

Optimization of the JS designer

After a deep analysis, as a result of research and comparative tests, we decided to replace the framework for creating a desktop version of the JS report designer. Previously, NW.js was used. Now the standalone JS designer is built using Electron. As a result, we were able to optimize the speed of the application, including getting and processing data, report rendering, displaying dashboards, and reducing the application run time.

Optimization of the JS designer

New features of the Cards

In spring 2022, we added a new element for dashboards - Cards. In the new version, we expanded the list of features for this element. The Cards element now supports the cross-filtering and grouping mode with dashboard elements. In addition, it is now possible to select a preset color collection to apply to cards or get this collection from the element style. You can do this using the Series Color property.
Cards

HTML preview modes

Starting with version 2022.3, you can define an HTML preview mode in the Preview Settings of a report. It’s relevant when creating a report in the desktop version of the report designer and its further viewing in a web browser. In earlier versions of the Web viewer, by default, you could use the TABLE mode to display reports, which had certain restrictions. You could switch to the DIV mode only when using the viewer option. Earlier, a selected mode was applied to all reports which were displayed in it, and the report template didn’t have any preview settings. Now a report creator can define the view mode as DIV or TABLE. It remains possible to define the preview mode for all reports at once, having set the appropriate value for the Web viewer option. By default, the preview mode in the viewer will be determined by the settings from a report.
HTML preview

New features for Maps

The new functionality in version 2022.3 also applies to maps in reports and GIS maps in dashboards. For the Map component in reports, the support of data drill down has been implemented. When clicking on a geographic object on the map, you can open another report page. For GIS maps in dashboards, the ability to specify a custom provider-server by URL, which considerably increases the flexibility of using this dashboard element in custom applications, is added.

New features for Maps

ECMAScript 2017

Starting with the 2022.3 version, Reports.JS and Dashboards.JS products are switching to ECMAScript 2017 language standard. We have carried out load testing of the report generator under the new version, and according to their results, the processing of a multi-page report accelerated by more than 25%. New ES2017 features remove barriers to our product development and allow us to keep up with the times.

ECMAScript 2017

Optimizations for OTF fonts

In the previous version, when exporting a report to PDF and in cases of using a *.otf custom font in reports, the font file was completely embedded into the document, which, in turn, could significantly increase the size of a PDF file. We have done some optimizations for *.otf fonts, which will result in integrating only those font characters that are needed to render the text in the current report when embedding the font in the document. In many cases, this will reduce the size of the PDF file. For *.ttf fonts, this optimization has been implemented in previous versions.

Optimizations for OTF fonts

New features of the WPF designer

In this release, we have added the Code tab for the WPF v2 report designer. This tab is an analog of the same tab in the Stimulsoft Designer. By default, this tab is disabled, and you may find the parameter to enable it in the context menu of the header page of the report template. In addition, in the report designer, we have completely redesigned the menu for opening and saving reports, having adapted them to the Microsoft Office style. The menu includes options for searching, fixing frequently used reports, specifying local storage, etc.

WPF designer
Today's article is about changing the text font as one of the options for customizing reports. Text is an essential "ingredient" in reports because it's the primary means of conveying information.
Our products contain three components that have the ability to customize and display some text:

  • Rich Text;
  • Text;
  • Text in cells.


You may change the font of the Rich Text component in its editor. You should select only the font you need in the drop-down list.

richtextNote

The Rich Text component is available only in WinForms and WPF designers. Other products use the HTML mode of the text component as an alternative.
You can change font of the Text component using the following methods:

  • from the Ribbon panel;
  • using properties;
  • using a style;
  • using conditions.
Note

The same way you may change the font in the Text in cells component.

Changing font from the Ribbon panel

ribbon
The first method to change the font of the Text component is to use the corresponding drop-down list on the Ribbon panel.

You should select a text component and choose a font in the drop-down list.
Note

The list of fonts available in the report designer is formed from fonts set in the current operating system; for web products - from fonts installed on the operating system of the server.

Changing font using properties

To change the font in properties, you should use the Font property.

Click the Browse button to the right of the property to call the expanded text editor.

editor properties

Changing font using a style

You can apply the Component style to a text component, which also has the ability to change the font using the Font property.

styles

Changing font using conditions

You can use Conditions to change fonts. The font is changed to a selected one when executing a specified condition.

conditionsNote

Changing the font of the text component using Conditions will be applied while switching to the Preview mode and export.

Using custom fonts

custom
When creating reports, you can use fonts which are not set in an operating system. To do this, you should load font files to report resources.

After adding a font to resources, it can be selected in one of the ways described above. You should know that custom fonts are displayed at the top of the list.
If you have any questions, please This email address is being protected from spambots. You need JavaScript enabled to view it..
We continue the series of articles about the Stimulsoft report designer. We have recently told you about the Chart element and how to create a dashboard with it. Now we’re going to tell you about the Gauge element.

Gauge

Gauge is a tool for data analysis that allows you to count values within a specified range. Using it, it’s possible to display processed values from data fields as a measuring device. The report designer contains five types of the gauge: Full Circular, Half-Circular, Vertical Linear, Horizontal Linear, and Bullet.

Gauges in dashboards
Gauges in dashboards

Gauge editor

Let's take a look at the basic features and settings of this element.

In the gauge, you may enter data both manually or add them from data sources. Data columns are specified in the following fields:

  • Value;
  • Target;
  • Series.

Gauges in dashboards
It's possible to create a range for all gauge types, having specified its minimum and maximum value. In addition to this, you can highlight a relative or an absolute part of a range with a specific color. For example: from 0 to 100 with green, from 100 to 135 with orange, and from 135 to 200 with violet.


Gauges in dashboards
Also, it’s possible to specify an absolute and a relative share as a percentage for a range. For example, for the range from 0 to 200, you can specify a relative share of 50 percent.


Gauges in dashboards
Besides, you can customize gauge labels – enable, disable, and place them inside or outside of the element. The same settings are applied to the target – a separate graphic element for a specific segment of values.

Style designer

In the properties panel, you can select the back color for your gauge, customize its border and corner radius, select font, text color, and style. By the way, some words about the style – you may select it in the properties panel and customize it in the style designer.

The Style designer will allow you to add one or several styles for your gauge and customize the brush, style font, format its borders, border sides, or create a collection of styles for the element. Also, you can create a style based on selected elements.

Gauges in dashboards
You can read about how to create a dashboard with this element in our documentation.
In the next article, we will tell you about the Online Map dashboard element. If you have any questions regarding the gauge or creating a dashboard with it, please This email address is being protected from spambots. You need JavaScript enabled to view it..
Today we are announcing an important change in the work of products for creating Stimulsoft reports and dashboards. Starting with the next version, 2022.3, we will stop supporting .NET Standard 2.0 for all our Web components. Thus, .NET Standard 2.1 version is becoming the minimum supported standard version.

What’s new in .NET Standard 2.1

.NET Standard is a formal specification of .NET APIs that are available on multiple .NET implementations. .NET Standard 2.0 was released on 14 August 2017, and .NET Standard 2.1 was released in November 2018. We continued to support both standards before and including version 2022.2.6. Microsoft stopped the support of .NET Standard 2.0 on 23 December 2019 and fully focused on the new Standard version.

Basic new features of .NET Standard 2.1:

  • The support of the Span. It allows you to work with arrays and strings. It fundamentally lays in new features, affecting program performance in .NET Standard 2.1;
  • About three thousand new APIs which weren’t in .NET Standard 2.0 have been added;
  • Foundational API – affects performance and increases the list of the program interfaces;
  • Reflection.Emit – adds technology of fast generation types, helps optimize the performance;
  • Previously used API SIMD is added now to the NuGet package;
  • Updated ValueTask increases the performance;
  • DbProviderFactories simplifies the use of ADO.NET – a technology that allows you to work with data quickly.

.NET Standard 2.1 and Stimulsoft products

The use of version 2.0 held back the development of the company's products to a certain extent because we need to compile the Stimulsoft libraries for projects that use .NET Standard 2.0. Starting with the next version 2022.3, our products will stop working in projects and applications, that use outdated versions of .NET Core - 2.0, 2.1, 2.2.

New .NET Standard 2.1 is backward compatible with the previous version and supports the latest releases .NET Core 3.0 and higher, including the last version of .NET – 6.0. All of this will significantly improve the functionality of our products, will make the work with data more effective and quick, and won’t disrupt the work of existing applications.
If you have any questions, please contact us.
By using this website, you agree to the use of cookies for analytics and personalized content. Cookies store useful information on your computer to help us improve efficiency and usability. For more information, please read the privacy policy and cookie policy.