Print and Export in ASP.NET MVC Linear Gauge
21 Dec 20226 minutes to read
The rendered Linear Gauge can be printed directly from the browser by calling the print
method. To use the print functionality, set the AllowPrint
property as true.
@using Syncfusion.EJ2;
@Html.EJS().Button("togglebtn").IconCss("e-icons e-play-icon").Content("Print").CssClass("e-flat").Render()
@Html.EJS().LinearGauge("linear").Height("450px").AllowPrint(true).Width("650px").Render()
<script>
document.getElementById('togglebtn').onclick = function () {
var linearObj = document.getElementById('linear').ej2_instances[0];
linearObj.print();
};
</script>
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using EJ2_Core_Application.Models;
using Newtonsoft.Json;
using Syncfusion.EJ2.Charts;
using Syncfusion.EJ2.LinearGauge;
namespace EJ2_Core_Application.Controllers
{
public class HomeController : Controller
{
public IActionResult Index()
{
return View();
}
}
}
Export
Image Export
To use the image export functionality, set the AllowImageExport
property as true. The rendered Linear Gauge can be exported as an image using the export
method. This method requires two parameters: export type and file name. The Linear Gauge can be exported as an image with the following formats.
- JPEG
- PNG
@using Syncfusion.EJ2;
@Html.EJS().Button("togglebtn").IconCss("e-icons e-play-icon").Content("Export").CssClass("e-flat").Render()
@Html.EJS().LinearGauge("linear").Height("450px").AllowImageExport(true).Width("650px").Render()
<script>
document.getElementById('togglebtn').onclick = function () {
var linearObj = document.getElementById('linear').ej2_instances[0];
linearObj.export('PNG', 'LinearGauge');
};
</script>
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using EJ2_Core_Application.Models;
using Newtonsoft.Json;
using Syncfusion.EJ2.Charts;
using Syncfusion.EJ2.LinearGauge;
namespace EJ2_Core_Application.Controllers
{
public class HomeController : Controller
{
public IActionResult Index()
{
return View();
}
}
}
PDF Export
To use the PDF export functionality, set the AllowPdfExport
property as true. The rendered Linear Gauge can be exported as PDF using the export
method. The export
method requires three parameters: file type, file name, and orientation of the PDF document. The orientation of the PDF document can be set as Portrait or Landscape.
@using Syncfusion.EJ2;
@Html.EJS().Button("togglebtn").IconCss("e-icons e-play-icon").Content("Export").CssClass("e-flat").Render()
@Html.EJS().LinearGauge("linear").Height("450px").AllowPdfExport(true).Width("650px").Render()
<script>
document.getElementById('togglebtn').onclick = function () {
var linearObj = document.getElementById('linear').ej2_instances[0];
linearObj.export('PDF', 'LinearGauge', 0);
};
</script>
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using EJ2_Core_Application.Models;
using Newtonsoft.Json;
using Syncfusion.EJ2.Charts;
using Syncfusion.EJ2.LinearGauge;
namespace EJ2_Core_Application.Controllers
{
public class HomeController : Controller
{
public IActionResult Index()
{
return View();
}
}
}
Exporting Linear Gauge as base64 string of the file
The Linear Gauge can be exported as base64 string for the JPEG, PNG and PDF formats. The rendered Linear Gauge can be exported as base64 string of the exported image or PDF document used in the export
method. The arguments that are required for this method is export type, file name, orientation of the exported PDF document and allowDownload boolean value that is set as false to return base64 string. The value for the orientation of the exported PDF document is set as null for image export and Portrait or Landscape for the PDF document.
@using Syncfusion.EJ2;
@Html.EJS().Button("togglebtn").IconCss("e-icons e-play-icon").Content("Export").CssClass("e-flat").Render()
@Html.EJS().LinearGauge("linear").Height("450px").AllowImageExport(true).Width("650px").Render()
<script>
document.getElementById('togglebtn').onclick = function () {
var linearObj = document.getElementById('linear').ej2_instances[0];
linearObj.export('JPEG', 'LinearGauge', null, false).then((data) => {
let base64 = data;
document.writeln(base64);
});
};
</script>
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using EJ2_Core_Application.Models;
using Newtonsoft.Json;
using Syncfusion.EJ2.Charts;
using Syncfusion.EJ2.LinearGauge;
namespace EJ2_Core_Application.Controllers
{
public class HomeController : Controller
{
public IActionResult Index()
{
return View();
}
}
}
NOTE
The exporting of the Linear Gauge as base64 string is not applicable for the SVG format.