Skip to content

Commit cd787ed

Browse files
marin-bratanovmarin-bratanov
committed
chore(chart): cleanup
1 parent ee32634 commit cd787ed

File tree

8 files changed

+15
-61
lines changed

8 files changed

+15
-61
lines changed

Diff for: ‎chart/print-chart-only/print-chart/Components/PrintableChart.razor

+4-5
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@
55

66
<TelerikChart Width="700px" Height="400px">
77
<ChartSeriesItems>
8-
<ChartSeries Type="@seriesType" Name="Product 1" Data="@series1Data">
8+
<ChartSeries Type="@SeriesType" Name="Product 1" Data="@series1Data">
99
</ChartSeries>
10-
<ChartSeries Type="@seriesType" Name="Product 2" Data="@series2Data">
10+
<ChartSeries Type="@SeriesType" Name="Product 2" Data="@series2Data">
1111
</ChartSeries>
1212
</ChartSeriesItems>
1313

@@ -24,9 +24,7 @@
2424

2525
@code {
2626
[Parameter]
27-
public ChartSeriesType seriesType { get; set; }
28-
[Parameter]
29-
public EventCallback<ChartSeriesType> seriesTypeChanged { get; set; }
27+
public ChartSeriesType SeriesType { get; set; }
3028

3129

3230
bool isPrinting { get; set; }
@@ -37,6 +35,7 @@
3735
isPrinting = true;
3836
await InvokeAsync(StateHasChanged);
3937
await Task.Delay(20);
38+
// we let the new class render in the browser before telling it to print so it can have effect
4039
await JSRuntime.InvokeVoidAsync("print");
4140
isPrinting = false;
4241
}

Diff for: ‎chart/print-chart-only/print-chart/Data/WeatherForecast.cs

-15
This file was deleted.

Diff for: ‎chart/print-chart-only/print-chart/Data/WeatherForecastService.cs

-25
This file was deleted.

Diff for: ‎chart/print-chart-only/print-chart/Pages/Index.razor

+5-9
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,9 @@
11
@page "/"
2-
@using PrintChartOnly.Components
32

4-
<PrintableChart @bind-seriesType="@series1Type" />
5-
<PrintableChart @bind-seriesType="@series2Type" />
6-
<PrintableChart @bind-seriesType="@series3Type" />
3+
@using PrintChartOnly.Components
74

5+
<div class="alert alert-info">Hover over a chart to get a button that will print it.</div>
86

9-
@code {
10-
ChartSeriesType series1Type = ChartSeriesType.Bar;
11-
ChartSeriesType series2Type = ChartSeriesType.Line;
12-
ChartSeriesType series3Type = ChartSeriesType.Area;
13-
}
7+
<PrintableChart SeriesType="@ChartSeriesType.Bar" />
8+
<PrintableChart SeriesType="@ChartSeriesType.Line" />
9+
<PrintableChart SeriesType="@ChartSeriesType.Area" />

Diff for: ‎chart/print-chart-only/print-chart/Pages/_Host.cshtml

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
@page "/"
2-
@namespace PrintingCharts.Pages
2+
@namespace PrintChartOnly.Pages
33
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
44

55
<!DOCTYPE html>

Diff for: ‎chart/print-chart-only/print-chart/Startup.cs

-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
using Microsoft.Extensions.Configuration;
66
using Microsoft.Extensions.DependencyInjection;
77
using Microsoft.Extensions.Hosting;
8-
using PrintingCharts.Data;
98
using System;
109
using System.Collections.Generic;
1110
using System.Linq;
@@ -29,7 +28,6 @@ public void ConfigureServices(IServiceCollection services)
2928
services.AddRazorPages();
3029
services.AddServerSideBlazor();
3130
services.AddTelerikBlazor();
32-
services.AddSingleton<WeatherForecastService>();
3331
}
3432

3533
// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.

Diff for: ‎chart/print-chart-only/print-chart/print-chart.csproj

+1
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22

33
<PropertyGroup>
44
<TargetFramework>net5.0</TargetFramework>
5+
<RootNamespace>PrintChartOnly</RootNamespace>
56
</PropertyGroup>
67

78
<ItemGroup>

Diff for: ‎chart/print-chart-only/readme.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@ This example shows how to print separate Chart components.
55
By using the browser printing engine and some custom CSS you can hide everything else on the page so only the chart will show up.
66

77
Key points of interest:
8-
* Add the custom CSS for the print mode in a separate file and include `media` parameter in the stylesheet link.
9-
* Wrap the Chart component in a container to which you can define a class and style it where needed (for example, if you have multiple charts on the page you can hide some of them and print only a specific one)
8+
* Add the custom CSS for the print mode in a separate file and include `media` parameter in the stylesheet link (see `_Host.cshtml`).
9+
* Wrap the Chart component in a container to which you can define a class and style it where needed (for example, if you have multiple charts on the page you can hide some of them and print only a specific one) - see `~/Components/PrintableChart.razor`.
1010
* We use JS Interop to call the browser `print` method that does the actual printing. What we do is to add the desired CSS to the project so it prints what we want.
11-
* Make sure that the browser will print background graphics (this is a checkbox on the browser Print dialog) so that you can get the proper colors on the chart.
11+
* You might need to make sure that the browser will print background graphics (this is a checkbox on the browser Print dialog) so that you can get the proper colors on the chart and/or other elements.
1212

13-
<strong>Note:</strong> A `Class` parameter for the Chart will be available in 2.21.0.
13+
**Note**: A `Class` parameter for the Chart will be available in 2.21.0.

0 commit comments

Comments
 (0)