Можно ли рисовать диаграммы (кривые, гистограммы, круги) с помощью С# через ASP.NET MVC 4 (Razor). Я пытаюсь сделать некоторые графики из данных, извлеченных из моей базы данных. Но я не могу найти, как это сделать.
Ответ 2
Если вы хотите отображать свои данные в графической форме, вы можете использовать хелпер Chart. Помощник диаграммы может отображать изображение, отображающее данные в разных типах диаграмм.
Вы можете создать представление с кодом бритвы для диаграммы следующим образом (скажем, его MyChart.cshtml).
Гистограмма из массива с темой
@{
var myChart = new Chart(width: 600, height: 400, theme: ChartTheme.Green)
.AddTitle("Chart Title")
.AddSeries(
name: "ChartTitle",
xValue: new[] { "Col1", "Col2", "Col3", "Col4", "Col5" },
yValues: new[] { "2", "6", "4", "5", "3" })
.Write();
}
Круговая диаграмма из массива
@{
var myChart = new Chart(width: 600, height: 400, theme: ChartTheme.Green)
.AddTitle("Chart Title")
.AddSeries(
name: "ChartTitle",
chartType: "Pie",
xValue: new[] { "Col1", "Col2", "Col3", "Col4", "Col5" },
yValues: new[] { "2", "6", "4", "5", "3" })
.Write();
}
Круговая диаграмма из массива с темой
@{
var myChart = new Chart(width: 600, height: 400)
.AddTitle("Chart Title")
.AddSeries(
name: "ChartTitle",
chartType: "Pie",
xValue: new[] { "Col1", "Col2", "Col3", "Col4", "Col5" },
yValues: new[] { "2", "6", "4", "5", "3" })
.Write();
}
Диаграмма с использованием DB Query
@{
var db = Database.Open("DBName");
var data = db.Query("SELECT Col1, Col2 FROM Table");
var myChart = new Chart(width: 600, height: 400)
.AddTitle("Chart Title")
.DataBindTable(dataSource: data, xField: "Col1")
.Write();
}
Вы можете использовать эти виды диаграмм /PartialView, где когда-либо требуется как src изображения.
ех.
<html>
<body>
<img src="MyChart.cshtml" />
<!-- or <img src='@Url.Action("Controler","ActionNameOfChartRenderingView")' />-->
<body>
<html>
Диаграммы Theams
Ваниль Отображает красные столбцы на белом фоне.
Синий Отображает синие столбцы на синем фоне градиента.
Зеленый Отображает синие столбцы на фоне зеленого градиента.
Желтый Отображает оранжевые столбцы на желтом фоне градиента.
Vanilla3D Отображает трехмерные красные столбцы на белом фоне.
Перечисление SeriesChartType поддерживает следующее:
- Область
- Bar
- BoxPlot
- Bubble
- Подсвечник
- Столбец
- Donut
- ErrorBar
- FastLine
- FastPoint
- Воронка
- Kagi
- Линия
- Pie
- Точка
- PointAndFigure
- Polar
- Пирамида
- Radar
- Диапазон
- RangeBar
- RangeColumn
- Ренко
- Spline
- SplineArea
- SplineRange
- StackedArea
- StackedArea100
- StackedBar
- StackedBar100
- StackedColumn
- StackedColumn100
- StepLine
- Фото
- ThreeLineBreak
Это список имен, которые вы можете передать в качестве строк для хелпера диаграммы на странице Razor.
Это помощник
namespace System.Web.Helpers
{
public class Chart
{
public Chart(int width, int height, string template = null, string templatePath = null);
public string FileName { get; }
public int Height { get; }
public int Width { get; }
public Chart AddLegend(string title = null, string name = null);
public Chart AddSeries(string name = null, string chartType = "Column", string chartArea = null, string axisLabel = null, string legend = null, int markerStep = 1, IEnumerable xValue = null, string xField = null, IEnumerable yValues = null, string yFields = null);
public Chart AddTitle(string text = null, string name = null);
public Chart DataBindCrossTable(IEnumerable dataSource, string groupByField, string xField, string yFields, string otherFields = null, string pointSortOrder = "Ascending");
public Chart DataBindTable(IEnumerable dataSource, string xField = null);
public byte[] GetBytes(string format = "jpeg");
public static Chart GetFromCache(string key);
public Chart Save(string path, string format = "jpeg");
public string SaveToCache(string key = null, int minutesToCache = 20, bool slidingExpiration = true);
public Chart SaveXml(string path);
public Chart SetXAxis(string title = "", double min = 0, double max = 0.0 / 0.0);
public Chart SetYAxis(string title = "", double min = 0, double max = 0.0 / 0.0);
public WebImage ToWebImage(string format = "jpeg");
public Chart Write(string format = "jpeg");
public static Chart WriteFromCache(string key, string format = "jpeg");
}
}
Надеюсь, это поможет вам.
