Cardiovascular Disease Detection In ASP.NET Core Using ML.NET

Problem

Dataset

• Open Visual Studio and create a new project, and select ASP.NET Core.
  
• Enter the project name and click on the "Create" button.
  
• Select ASP.NET Web Application (Model View Controller).
  
• Our ASP.NET Core MVC project template has been created.
• So first of all, we will build, train and evaluate our model using ML.NET Model Builder.
• Right-Click on the project and Select Add>Machine Learning.
  
• ML.NET Model Builder window will be shown. Now, select a custom scenario because we are going to build our model from our Cardiovascular Disease dataset.
  
• We will use the Cardiovascular Disease data set file in .csv format. Select the dataset from your local directories where you place the .csv file then select the column that will be used to the prediction label.
  
• After training dataset selection, select the Machine learning task as binary-classification because this model will tell us only if the patient has a disease or not.
• Select the time to train the model. Click on start training.
  
• ML.NET Model builder will start training our Machine Learning Model. I've selected only 5 minutes (300 seconds). You can choose the duration for training as you want.
• Now our model has been trained successfully. Click on the Evaluate button to evaluate the new Cardiovascular Disease Detection MLModel.
  
• The Evaluate Window shows the performance of the best and worst algorithms on this dataset.
  
• Now, click on the code button to consume this model into our ASP.NET Core project. When the code window shows up, click on "Add Project". This will include two new build projects into our Visual Studio solution.
  
• Our ML Model project has been added to our Visual Studio solution. Now, we will use the shown ML.NET Model builder window to consume this model.
  
• So we have built, trained, and evaluated our model successfully. Now, it is time to integrate this and consume in our ASP.NET Core MVC project.
• Here is how our complete solution looks.
  

• Now, install Microsoft.ML in ASP.NET Core MVC project. Right-click on Dependencies and Select Manage Nuget Package and install Microsoft.ML or Open Nuget Package Manager console and use this command Install-Package Microsoft.ML.
  
• Now we will create our User Interface to interact with Cardiovascular Disease Detection Model. So, first of all, create a new controller name CardiovascularDisease and insert the following snippet.
  1. using Microsoft.AspNetCore.Mvc;
  2. using Cardiovascular_Disease_DetectionML.Model;
  4. namespace Cardiovascular_Disease_Detection.Controllers
  5. {
  6. public class CardiovascularDiseaseController : Controller
  7. {
  8. [HttpGet]
  9. public IActionResult Predict()
  10. {
  11. return View();
  12. }
  13. [HttpPost]
  14. public IActionResult Predict(ModelInput input)
  15. {
  16. var prediction = ConsumeModel.Predict(input);
  17. ViewBag.Result = prediction;
  18. return View();
  19. }
  20. }
  21. }

• Now we need a view that will be used to post input data from user and show output result to the user. Create a new view inside Views>CardiovascularDisease folder named Predict and paste the following snippet.
  1. @model Cardiovascular_Disease_DetectionML.Model.ModelInput
  3. @{
  4. ViewData["Title"] = "Cardiovascular Diseasese Prediction";
  5. }
  7. <h2>Cardiovascular Disease Detection in ASP.NET Core Using ML.NET</h2>
  8. <hr />
  9. @if (ViewBag.Result != null)
  10. {
  11. <div class="row">
  12. <div class="col-md-6">
  13. <h4>Prediction:@ViewBag.Result.Prediction</h4>
  14. </div>
  15. <div class="col-md-6">
  16. <h4>Score:@ViewBag.Result.Score</h4>
  17. </div>
  18. </div>
  19. <hr />
  20. }
  22. <div class="row">
  23. <div class="col-md-12">
  24. <form asp-action="Predict">
  25. <div asp-validation-summary="ModelOnly" class="text-danger"></div>
  26. <div class="row">
  27. <div class="form-group col-md-4">
  28. <label asp-for="Age" class="control-label"></label>
  29. <input asp-for="Age" class="form-control" />
  30. <span asp-validation-for="Age" class="text-danger"></span>
  31. </div>
  32. <div class="form-group col-md-4">
  33. <label asp-for="Gender" class="control-label"></label>
  34. <select asp-for="Gender" class="form-control">
  35. <option value="1">Woman</option>
  36. <option value="2">Man</option>
  37. </select>
  38. <span asp-validation-for="Gender" class="text-danger"></span>
  39. </div>
  40. <div class="form-group col-md-4">
  41. <label asp-for="Height" class="control-label"></label>
  42. <input asp-for="Height" class="form-control" />
  43. <span asp-validation-for="Height" class="text-danger"></span>
  44. </div>
  45. <div class="form-group col-md-4">
  46. <label asp-for="Weight" class="control-label"></label>
  47. <input asp-for="Weight" class="form-control" />
  48. <span asp-validation-for="Weight" class="text-danger"></span>
  49. </div>
  50. <div class="form-group col-md-4">
  51. <label asp-for="Ap_hi" class="control-label"></label>
  52. <input asp-for="Ap_hi" class="form-control" />
  53. <span asp-validation-for="Ap_hi" class="text-danger"></span>
  54. </div>
  55. <div class="form-group col-md-4">
  56. <label asp-for="Ap_lo" class="control-label"></label>
  57. <input asp-for="Ap_lo" class="form-control" />
  58. <span asp-validation-for="Ap_lo" class="text-danger"></span>
  59. </div>
  60. <div class="form-group col-md-4">
  61. <label asp-for="Cholesterol" class="control-label"></label>
  62. <select asp-for="Cholesterol" class="form-control">
  63. <option value="1">Normal</option>
  64. <option value="2">Above Normal</option>
  65. <option value="3">Well Above Normal</option>
  66. </select>
  67. <span asp-validation-for="Cholesterol" class="text-danger"></span>
  68. </div>
  69. <div class="form-group col-md-4">
  70. <label asp-for="Gluc" class="control-label"></label>
  71. <select asp-for="Gluc" class="form-control">
  72. <option value="1">Normal</option>
  73. <option value="2">Above Normal</option>
  74. <option value="3">Well Above Normal</option>
  75. </select>
  76. <span asp-validation-for="Gluc" class="text-danger"></span>
  77. </div>
  78. <div class="form-group col-md-4">
  79. <label asp-for="Smoke" class="control-label"></label>
  80. <select asp-for="Smoke" class="form-control">
  81. <option value="1">Smoke</option>
  82. <option value="0">Not Smoke</option>
  83. </select>
  84. <span asp-validation-for="Smoke" class="text-danger"></span>
  85. </div>
  86. <div class="form-group col-md-4">
  87. <label asp-for="Alco" class="control-label"></label>
  88. <select asp-for="Alco" class="form-control">
  89. <option value="1">Intake</option>
  90. <option value="0">Not Intake</option>
  91. </select>
  92. <span asp-validation-for="Alco" class="text-danger"></span>
  93. </div>
  94. <div class="form-group col-md-4">
  95. <label asp-for="Active" class="control-label"></label>
  96. <select asp-for="Active" class="form-control">
  97. <option value="1">True</option>
  98. <option value="0">False</option>
  99. </select>
  100. <span asp-validation-for="Active" class="text-danger"></span>
  101. </div>
  103. </div>
  104. <div class="form-group text-right">
  105. <input type="submit" value="Predict" class="btn btn-primary" />
  106. </div>
  108. </form>
  109. </div>
  110. </div>
  111. @section Scripts {
  112. @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
  113. }

Demo

Conclusion

• Setup a Prerequisite environment.
• Download the Cardiovascular Disease Detection dataset.
• Create ASP.NET Core MVC project template.
• Start adding a machine learning model for our project.
• Select Machine Learning scenario.
• Select the dataset file and predicted column label.
• Set training tasks and time to train the model.
• Train model.
• Evaluate model.
• Add model to ASP.NET Core Project.
• Create a User interface.
• Consume Cardiovascular Disease Detection model into ASP.NET Core MVC project.
• Finally, build and run the project and test the application using the first record from the dataset file.