ASP.NET Wijmo 应用程序之C1LinearGauge和C1RadialGauge控件入门
问题描述:ASP.NET Wijmo 应用程序之C1LinearGauge和C1RadialGauge控件入门问题解答:C1LinearGauge控件可以提供你所需要的确切的图形表示。您可以从水平、垂直或倾斜的线性测量控件中进行选择。C1RadialGauge控件可以提供你所需要的确切的图形表示。您可以从圆形、螺旋形、弧曲线形、双扇弧形或半圆形的对称测量控件中进行选择。
关键代码:
<wijmo:C1LinearGauge ID="C1LinearGauge1" runat="server" Value="10" Width="500px">
<TickMajor Factor="2" Visible="True" Offset="0" Interval="10"></TickMajor>
<TickMinor Visible="False" Offset="0" Interval="5"></TickMinor>
<Pointer Length="0.5" Width="4" Offset="0"></Pointer>
<Animation Duration="2000" Easing="EaseOutBack"></Animation>
<Face>
<FaceStyle>
<Fill Color="#CC66FF">
</Fill>
</FaceStyle>
</Face>
</wijmo:C1LinearGauge>
<Ranges>
<Wijmo:GaugelRange EndDistance="0.58" EndValue="10" EndWidth="5" StartDistance="0.6" StartValue="0" StartWidth="2">
<RangeStyle Stroke="#7BA0CC" StrokeWidth="0">
<Fill Color="#7BA0CC"></Fill>
</RangeStyle>
</Wijmo:GaugelRange>
<Wijmo:GaugelRange EndDistance="0.54" EndValue="75" EndWidth="20" StartDistance="0.58" StartValue="10" StartWidth="5">
<RangeStyle Stroke="White" StrokeWidth="0">
<Fill ColorBegin="#B4D5F0" ColorEnd="#B4D5F0" Type="LinearGradient"></Fill>
</RangeStyle>
</Wijmo:GaugelRange>
<Wijmo:GaugelRange EndDistance="0.5" EndValue="100" EndWidth="25" StartDistance="0.54" StartValue="175" StartWidth="20">
<RangeStyle Stroke="#7BA0CC" StrokeWidth="0">
<Fill Color="#7BA0CC"></Fill>
</RangeStyle>
</Wijmo:GaugelRange>
</Ranges>
效果截图:
源码下载:
ASP.NET Wijmo 应用程序之C1LinearGauge和C1RadialGauge控件入门示例
页:
[1]