Thursday, 1 October 2015

How to Use Highcharts Chart Rotation JS with ASP.NET MVC 5

Step 1: First Create An Web Api Application with MVC sing Visual Studion 2013/15.

Step 2: Add the Highcharts reference to the Project.

Step 3:Create columnpricture.s in Model Folder

Step 4: Create the DbContext In Model Folder.

Step 5: Create a MVC Controller using EF and the select Model and DbContext... if you will not the the Model or Context in the dropdown then first build the solution then do again.

Step 6. Run the application and go to http://localhost:XXXX/Test

where XXXX is your localhost and Test is the controller name in my case.and Create some details like .

Step 7: Now to to Home Controller and Add this Action

public class HomeController : Controller

{

columnprictureEntities db = new columnprictureEntities();

public ActionResult Index()

{

ViewBag.Title = "Home Page";

return View();

}

public ActionResult Getdata()

{

var d = db.columnprictures.ToList();

List<columnpricture> bb = db.columnprictures.ToList();

return Json(d, JsonRequestBehavior.AllowGet);

//var d = (from b in db.columnprictures select b).ToList();

//List<columnpricture> bb = (from dd in db.columnprictures select dd).ToList();

//return Json(d, JsonRequestBehavior.AllowGet);

}

Step 8: Last step you have to Go to Index and add the View.

@{ Layout = null; }

<!DOCTYPE html>

<html>

<head>

$(function () {

var values = "";

var data1 = [];

months = [];

var count = [];

//var a = [29.9, 71.5, 106.4, 129.2, 144]

$.ajax({

url: '../Home/Getdata',

type: 'post',

dataType: "json",

success: function (msg) {

var values = JSON.stringify(msg)

//alert(msg.length)

for (var i = 0; i < msg.length; i++) {

//alert("123")

values += "11" + msg[i].tem + "11"

debugger;

//var a = values.push(bb[i].tem);

data1.push(msg[i].id)

months.push(msg[i].months)

count.push(msg[i].count)

}

var chart = new Highcharts.Chart({

chart: {

renderTo: 'container', type: 'column', margin: 75,

options3d: { enabled: true, alpha: 15, beta: 15, depth: 50, viewDistance: 25 }

}, title: { text: 'Chart rotation demo' }, xAxis: { categories: months },

yAxis: { min: 0, title: { text: 'count' } },

subtitle: { text: 'Test options by dragging the sliders below' }, plotOptions: {

column: {

depth: 25

}

}, series: [{ data: count }]

});

$('#R0').on('change', function () {

chart.options.chart.options3d.alpha = this.value;

showValues(); chart.redraw(false);

}); $('#R1').on('change', function () {

chart.options.chart.options3d.beta = this.value; showValues(); chart.redraw(false);

}); function showValues() {

$('#R0-value').html(chart.options.chart.options3d.alpha);

$('#R1-value').html(chart.options.chart.options3d.beta);

} showValues();

}

})

}); </script>

<title>Index</title>

</head>

<body>

<table>

<tr>

<td>Alpha Angle</td>

<td>

</td>

</tr>

<tr>

<td>Beta Angle</td>

<td>

</td>

</tr>

</table>

</div>

</body>

</html>

Output:)

Wednesday, 2 September 2015

Dependency Injection in ASP.NET MVC 5 or MVC 6 with Structure Map

Posted by .NetWithRavi on 23:17:00

Dependency Injection in ASP.NET MVC 5 or MVC 6 with Structure Map

You people may be wondering why we need dependency injection. So the answer is DI is a design pattern that basically let you to write a loosely coupled testable code or application.
Three types of dependency injection

There are at least three ways an object can receive a reference to an external module

Constructor injection: the dependencies are provided through a class constructor.
Setter injection: the client exposes a setter method that the injector uses to inject the dependency.
Interface injection: the dependency provides an injector method that will inject the dependency into any client passed to it. Clients must implement an interface that exposes a setter method that accepts the dependency.
But Today we will look Constructor injection.

In day to day life of coding or programming our one class generally depend on some other class.
Take a look of my MVC 5 code.

You can see that in index method, it requires to create an instance of "Employee" class to get the full name of a employee. It is very clear that the Index method is tightly coupled with the Employee class.
This is not good when it comes to testing HomeController class. Suppose that you have other methods, with similar types of class dependencies. So, each time when you test the code, you have to pass an actual instance Employee class. This is tedious. You don't have the luxury of passing a fake employee class to easily test your controllers.
So how do we decouple the Employee class from HomeController ? This is our question so

This is where DI comes in handy. You can inject dependencies in several ways. Today i will show you "constructor injection", where you simply inject the dependencies to the constructor of the class. (Ex: in the above example, inject dependencies to the constructor of the HomeController).

So we will look step by step ,How to implement DI using structure map in MVC 5 Application

Step 1 – We have to setup Structure Map

- Lets create a new MVC5 application in Visual Studio 2013/15.

Let's use popular "StructreMap" Ioc container to inject dependencies externally. To setup StructreMap, Open a nuget package manager and search for “StructreMap” and install it.
You can do the same thing using package manager console powershell.

Step 2 - Create IEmployee interface.

public interface IEmployee
{
string GetFullName();
}

Step 3 - Now Create the actual Employee class/concrete class. This class implements IEmployee interface.

public class Employee: IEmployee
{
public string GetFullName()
{
return "Ravi Kumar Singh";
}
}

Step 4 - Go to the HomeController. Since we use constructor injection, let's create a constructor for the HomeController. It will look similar to this.

public class HomeController : Controller
{
private readonly IEmployee _employee;

// constructor
public HomeController( IEmployee employee)
{
this._employee = employee;
}
//action method
public ActionResult Index()
{
return Content(this.employee.GetFullName());
}
}

Notice that, we are passing the IEmployee interface as the parameter for the constructor. Then we saved the passed parameter into a instant variable of type IEmployee. So what is the benefit of doing this?

Now you can pass any class that implements IEmployee interface to our HomeController. We can create a dummy class which implements IEmployee with dummy data and simply test our HomeController quite easily!

To do this, we need a way to Map our IEmployee interface either with Actual Class or Dummy Class. This is facilitated by our Ioc container "StrutureMap".

Step 5 - Goto ~/DependencyResolution -> IoC.cs file. This file is automatically created once you installed StructureMap. Change it as follows.

public static class IoC {
public static IContainer Initialize() {
ObjectFactory.Initialize(x =>
{
x.For<IEmployee>().Use<Employee>();
});
return ObjectFactory.Container;
}
}

x.For<IEmployee>().Use<FakeEmployee >();
You can easily replace the Actual Employee class with a Dummy Class. That's it.

Done ;)

Exercises in .NET with Ravi

This blog is written by Ravi Kumar Singh. He works at Clarion as a .NET Developer.

Thursday, 1 October 2015

How to Use Highcharts Chart Rotation JS with ASP.NET MVC 5

Wednesday, 2 September 2015

Dependency Injection in ASP.NET MVC 5 or MVC 6 with Structure Map

Dependency Injection in ASP.NET MVC 5 or MVC 6 with Structure Map

About Me

Popular Posts

Translate

Categories

Blog Archive

Follow us on Facebook

Contact Me

Total Pageviews