oguzhankircali
2/9/2018 - 1:25 PM

DtoGrafikItem.cs

@model AnketGrafikViewModel
@{
    Layout = null; //varsa master page'inizi belirtebilirsiniz
    //benim view'im partial view olduğu için canvasjs dosyası master sayfadan geliyor
}
//Bir tane div oluşturun buraya. ID'sini 'divGrafik' verin ve Height'i ayarlayın
<script type="text/javascript" //köşeli parantezleri ekleyip, wordpress sapıttı
    var dataPointsTemp = [];
    var temp = '@Html.Raw(Model.GrafikDegerleriJson)';
    var data = JSON.parse(temp);
    for (var i = 0; i < data.length; i++) {
         dataPointsTemp.push({ label: data[i].label, y: data[i].y, legendText: data[i].legendText });
    }
    var chart = new CanvasJS.Chart("divGrafiktitle: { text: ""},
    animationEnabled: true,
    legend: {
        verticalAlign: "center",
        horizontalAlign: "left",
        fontSize: 20,
        //fontFamily: "Helvetica"
    },
    theme: "theme2",
    data: [
    {
        type: "pie",
        indexLabelFontFamily: "Tahoma",
        indexLabelFontSize: 20,
        indexLabel: "{label} {y}%",
        startAngle: -20,
        showInLegend: true,
        toolTipContent: "{legendText} {y}%",
        dataPoints: dataPointsTemp
        }]
    });
    chart.render(); 
</script>
public class AnketGrafikViewModel
{
      public List<DtoGrafikItem> GrafikDegerleri { get; set; }
      public string GrafikDegerleriJson { get; set; }
}
public class DtoGrafikItem
{
      public decimal y { get; set; }
      public string tooltip { get; set; }
      public string label { get; set; }
}
public ActionResult PastaGrafigi()
{
      var model = new AnketGrafikViewModel();
      model.GrafikDegerleri.Add(new DtoGrafikItem { label = "Hiç", tooltip = "Hiç", y = 15 });
      model.GrafikDegerleri.Add(new DtoGrafikItem { label = "Az", tooltip = "Az", y = 20 });
      model.GrafikDegerleri.Add(new DtoGrafikItem { label = "Orta", tooltip = "Orta", y = 25 });
      model.GrafikDegerleri.Add(new DtoGrafikItem { label = "Çok", tooltip = "Çok", y = 35 });
      model.GrafikDegerleri.Add(new DtoGrafikItem { label = "Tam", tooltip = "Tam", y = 5 });
      model.GrafikDegerleriJson = new JavaScriptSerializer().Serialize(model.GrafikDegerleri);
      return View(model);
}
public class DtoGrafikItem
{
      public decimal y { get; set; }
      public string tooltip { get; set; }
      public string label { get; set; }
}