67 строки
2.3 KiB
Plaintext
67 строки
2.3 KiB
Plaintext
|
@using Syncfusion.JavaScript.DataVisualization
|
||
|
|
|
||
|
|
@section SampleHeading{<span class="sampleName">Sunburst-Zooming-ASP.NET MVC-SYNCFUSION</span>}
|
||
|
|
|
||
|
|
@section ControlsSection{
|
||
|
|
@{
|
||
|
|
var datasource = ViewData["zoomingData"];
|
||
|
|
}
|
||
|
|
<div>
|
||
|
|
@(Html.EJ().SunburstChart("container")
|
||
|
|
.ValueMemberPath("EmployeesCount")
|
||
|
|
.DataSource(datasource)
|
||
|
|
.Levels(lv =>
|
||
|
|
{
|
||
|
|
lv.GroupMemberPath("Country").Add();
|
||
|
|
lv.GroupMemberPath("JobDescription").Add();
|
||
|
|
lv.GroupMemberPath("JobGroup").Add();
|
||
|
|
lv.GroupMemberPath("JobRole").Add();
|
||
|
|
})
|
||
|
|
.DataLabelSettings(dt => dt.Visible(true))
|
||
|
|
.Tooltip(tp => tp.Visible(true))
|
||
|
|
.Palette(new List<string> { "#002e4d", "#005c99", "#008ae6", "#33adff", "#80ccff" })
|
||
|
|
.InnerRadius(0.2)
|
||
|
|
.Size(sz => sz.Height("600"))
|
||
|
|
.Title(ti => ti.Text("Employees Count"))
|
||
|
|
.EnableAnimation(true)
|
||
|
|
.Load("loadSunBurstTheme")
|
||
|
|
.ZoomSettings(zo => zo.Enable(true))
|
||
|
|
.Legend(lg => lg.Visible(false))
|
||
|
|
)
|
||
|
|
</div>
|
||
|
|
}
|
||
|
|
@section PropertiesSection
|
||
|
|
{
|
||
|
|
<div class="prop-grid">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-md-3">
|
||
|
|
Enable Zooming
|
||
|
|
</div>
|
||
|
|
<div class="col-md-3 aligntop">
|
||
|
|
<input type="checkbox" checked="checked" id="zooming" onchange="zooming()" />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
}
|
||
|
|
@section ScriptSection
|
||
|
|
{
|
||
|
|
<script type="text/javascript">
|
||
|
|
function zooming() {
|
||
|
|
var sunburst = $("#container").ejSunburstChart("instance");
|
||
|
|
if ($("#zooming").is(":checked"))
|
||
|
|
sunburst.model.zoomSettings.enable = true;
|
||
|
|
else {
|
||
|
|
sunburst.model.zoomSettings.enable = false;
|
||
|
|
}
|
||
|
|
sunburst.redraw();
|
||
|
|
}
|
||
|
|
|
||
|
|
$("#sampleProperties").ejPropertiesPanel();
|
||
|
|
</script>
|
||
|
|
}
|
||
|
|
|
||
|
|
@section MetaTags{
|
||
|
|
<meta name="description" content="This sample demonstrates the employee count based on the country using zooming feature in the Syncfusion ASP.NET Web Forms Sunburst control.">
|
||
|
|
}
|
||
|
|
|