Wijmo5RadialGauge
Wijmo5RadialGauge
Overview
Features
Settings
Export
Export Format : Height : Width : Export Name :
Description
This sample demonstrates how to export a wijmo5 RadialGauge to image file.
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; using WebApiExplorer.Models; namespace WebApiExplorer.Controllers { public partial class Wijmo5RadialGaugeController : Controller { private readonly ImageExportOptions _radialGaugeModel = new ImageExportOptions { Exporter = "wijmo.gauge.ImageExporter" }; private readonly ClientSettingsModel _demoSettingsModel = new ClientSettingsModel { Settings = new Dictionary<string, object[]> { {"IsReadOnly", new object[]{false, true }}, {"Step", new object[]{0.5, 1, 2}}, {"ShowRanges", new object[]{true, false}}, {"ShowText", new object[]{"All", "Value", "MinMax", "None"}}, {"SweepAngle", new object[]{180, 270, 360}}, {"StartAngle", new object[]{0, 90, 180, 270, 360}} } }; public ActionResult Index() { ViewBag.DemoSettingsModel = _demoSettingsModel; ViewBag.Options = _radialGaugeModel; return View(); } } } @using WebApiExplorer.Models @{ ClientSettingsModel settings = ViewBag.DemoSettingsModel; ImageExportOptions optionsModel = ViewBag.Options; ViewBag.DemoSettings = true; } <div id="@(optionsModel.ControlId)" style="width:400px; height:200px"></div> @section Settings{ @Html.Partial("_ImageExportOptions", optionsModel) } <script> var gauge = new wijmo.gauge.RadialGauge("#@(optionsModel.ControlId)"), lowerRange = new wijmo.gauge.Range(), middleRange = new wijmo.gauge.Range(), upperRange = new wijmo.gauge.Range(); gauge.value = 5; gauge.max = 10; gauge.min = 0; gauge.format = ""; gauge.step = 0.5; gauge.pointer.thickness = 0.5; gauge.showText = "All"; gauge.sweepAngle = 180; gauge.startAngle = 0; gauge.isReadOnly = false; // set Range propeties lowerRange.min = 1; lowerRange.max = 2; lowerRange.color = "Red"; middleRange.min = 3; middleRange.max = 4; middleRange.color = "Green"; upperRange.min = 7; upperRange.max = 10; upperRange.color = "Yellow"; gauge.ranges.push(lowerRange); gauge.ranges.push(middleRange); gauge.ranges.push(upperRange); </script> @section Description{ @Html.Raw(Resources.Wijmo5RadialGauge.Index_Text0) }