Wednesday, 29 May 2019

MVC - Chart - Display multiple charts in one View



Watch this example on YouTube


 

1. Controller

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Helpers;


namespace WebApplication7.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Chart1()
        {
            var key = new Chart(width: 300, height: 300)
                .AddTitle("Employee 1")
                .AddSeries(
                    chartType: "Bubble",
                    name: "Emp1",
                    xValue: new[] { "Peter", "Frank", "Bob", "Ann" },
                    yValues: new[] { "2", "4", "3", "7" }
                );
            return File(key.ToWebImage().GetBytes(), "image/jpeg");
        }
        public ActionResult Chart2()
        {
            var key = new Chart(width: 300, height: 300)
                .AddTitle("Employee 2")
                .AddSeries(
                    chartType: "Column",
                    name: "Emp2",
                    xValue: new[] { "Peter", "Frank", "Bob", "Ann" },
                    yValues: new[] { "2", "4", "3", "7" }
                );
            return File(key.ToWebImage().GetBytes(), "image/jpeg");
        }

2. View

@{
    ViewBag.Title = "Home Page";
}


<img src="@Url.Action("Chart1")" />
<img src="@Url.Action("Chart2")" />

No comments:

Post a Comment