本文整理汇总了C#中Highcharts类的典型用法代码示例。如果您正苦于以下问题:C# Highcharts类的具体用法?C# Highcharts怎么用?C# Highcharts使用的例子?那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。
Highcharts类属于命名空间,在下文中一共展示了Highcharts类的15个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的C#代码示例。
示例1: BindDataFromDictionary
public ActionResult BindDataFromDictionary()
{
Dictionary<DateTime, int> data = new Dictionary<DateTime, int>
{
{ DateTime.Now.AddDays(-10).Date, 123 },
{ DateTime.Now.AddDays(-9).Date, 223 },
{ DateTime.Now.AddDays(-8).Date, 103 },
{ DateTime.Now.AddDays(-7).Date, 23 },
{ DateTime.Now.AddDays(-6).Date, 183 },
{ DateTime.Now.AddDays(-5).Date, 143 },
{ DateTime.Now.AddDays(-4).Date, 153 },
{ DateTime.Now.AddDays(-3).Date, 173 },
{ DateTime.Now.AddDays(-2).Date, 133 },
{ DateTime.Now.AddDays(-1).Date, 113 },
{ DateTime.Now.Date, 123 }
};
object[,] chartData = new object[data.Count, 2];
int i = 0;
foreach (KeyValuePair<DateTime, int> pair in data)
{
chartData.SetValue(pair.Key, i, 0);
chartData.SetValue(pair.Value, i, 1);
i++;
}
Highcharts chart1 = new Highcharts("chart1")
.InitChart(new Chart { Type = ChartTypes.Area })
.SetTitle(new Title { Text = "Chart 1" })
.SetXAxis(new XAxis { Type = AxisTypes.Datetime })
.SetSeries(new Series { Data = new Data(chartData) });
return View(chart1);
}
示例2: BindDataFromObjectList
public ActionResult BindDataFromObjectList()
{
List<DataClass> data = new List<DataClass>
{
new DataClass { ExecutionDate = DateTime.Now.AddDays(-10).Date, ExecutionValue = 20.21 },
new DataClass { ExecutionDate = DateTime.Now.AddDays(-9).Date, ExecutionValue = 23.13 },
new DataClass { ExecutionDate = DateTime.Now.AddDays(-8).Date, ExecutionValue = 27.41 },
new DataClass { ExecutionDate = DateTime.Now.AddDays(-7).Date, ExecutionValue = 30.51 },
new DataClass { ExecutionDate = DateTime.Now.AddDays(-6).Date, ExecutionValue = 21.16 },
new DataClass { ExecutionDate = DateTime.Now.AddDays(-5).Date, ExecutionValue = 22.17 },
new DataClass { ExecutionDate = DateTime.Now.AddDays(-4).Date, ExecutionValue = 33.18 },
new DataClass { ExecutionDate = DateTime.Now.AddDays(-3).Date, ExecutionValue = 34.91 },
new DataClass { ExecutionDate = DateTime.Now.AddDays(-2).Date, ExecutionValue = 40.10 },
new DataClass { ExecutionDate = DateTime.Now.AddDays(-1).Date, ExecutionValue = 50.11 },
new DataClass { ExecutionDate = DateTime.Now.Date, ExecutionValue = 20.1 },
};
object[,] chartData = new object[data.Count, 2];
int i = 0;
foreach (DataClass item in data)
{
chartData.SetValue(item.ExecutionDate, i, 0);
chartData.SetValue(item.ExecutionValue, i, 1);
i++;
}
Highcharts chart1 = new Highcharts("chart1")
.InitChart(new Chart { Type = ChartTypes.Column })
.SetTitle(new Title { Text = "Chart 1" })
.SetXAxis(new XAxis { Type = AxisTypes.Datetime })
.SetSeries(new Series { Data = new Data(chartData) });
return View(chart1);
}
示例3: MultipleXAxes
public ActionResult MultipleXAxes()
{
// Example from JSFIDDLE: http://jsfiddle.net/kSkYN/4502/
Highcharts chart = new Highcharts("chart")
.SetTitle(new Title { Text = "Multiple X-Axes" })
.SetXAxis(new[]
{
new XAxis { Type = AxisTypes.Datetime },
new XAxis { Type = AxisTypes.Datetime, Opposite = true }
})
.SetSeries(new[]
{
new Series
{
Data = new Data(new object[] { 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4 }),
PlotOptionsSeries = new PlotOptionsSeries
{
PointStart = new PointStart(new DateTime(2010, 1, 1)),
PointInterval = 24 * 3600 * 1000 // one day
}
},
new Series
{
Data = new Data(new object[] { 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0 }),
PlotOptionsSeries = new PlotOptionsSeries
{
PointStart = new PointStart(new DateTime(2010, 1, 10)),
PointInterval = 24 * 3600 * 1000, // one day
},
XAxis = "1"
}
});
return View(chart);
}
示例4: AreaWithMissingPoints
public ActionResult AreaWithMissingPoints()
{
Highcharts chart = new Highcharts("chart")
.InitChart(new Chart { DefaultSeriesType = ChartTypes.Area, SpacingBottom = 30 })
.SetTitle(new Title { Text = "Fruit consumption *" })
.SetSubtitle(new Subtitle
{
Text = @"* Jane\'s banana consumption is unknown",
Floating = false,
Align = HorizontalAligns.Right,
VerticalAlign = VerticalAligns.Bottom,
Y = 15
})
.SetLegend(new Legend
{
Layout = Layouts.Vertical,
Align = HorizontalAligns.Left,
VerticalAlign = VerticalAligns.Top,
X = 150,
Y = 100,
Floating = true,
BorderWidth = 1,
BackgroundColor = new BackColorOrGradient(ColorTranslator.FromHtml("#FFFFFF"))
})
.SetXAxis(new XAxis { Categories = new[] { "Apples", "Pears", "Oranges", "Bananas", "Grapes", "Plums", "Strawberries", "Raspberries" } })
.SetYAxis(new YAxis
{
Title = new YAxisTitle { Text = "Y-Axis" },
Labels = new YAxisLabels { Formatter = "function() { return this.value; }" }
})
.SetTooltip(new Tooltip { Formatter = "function() { return '<b>'+ this.series.name +'</b><br/>'+ this.x +': '+ this.y; }" })
.SetPlotOptions(new PlotOptions { Area = new PlotOptionsArea { FillOpacity = 0 } })
.SetCredits(new Credits { Enabled = false })
.SetSeries(new[]
{
new Series { Name = "John", Data = new Data(new object[] { 0, 1, 4, 4, 5, 2, 3, 7 }) },
new Series { Name = "Jane", Data = new Data(new object[] { 1, 0, 3, null, 3, 1, 2, 1 }) }
});
return View(chart);
}
示例5: CrosshairsWithBooleanValues
public ActionResult CrosshairsWithBooleanValues()
{
Highcharts chart = new Highcharts("chart")
.SetXAxis(new XAxis
{
Categories = new[] { "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" }
})
.SetSeries(new Series
{
Data = new Data(new object[] { 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4 })
}).SetTooltip(new Tooltip { Shared = true, Crosshairs = new Crosshairs(true, true), Enabled = true });
return View(chart);
}
示例6: BarWithNegotiveStack
public ActionResult BarWithNegotiveStack()
{
string[] categories = new[]
{
"0-4", "5-9", "10-14", "15-19",
"20-24", "25-29", "30-34", "35-39", "40-44",
"45-49", "50-54", "55-59", "60-64", "65-69",
"70-74", "75-79", "80-84", "85-89", "90-94",
"95-99", "over 100"
};
Highcharts chart = new Highcharts("chart")
.InitChart(new Chart { DefaultSeriesType = ChartTypes.Bar })
.SetTitle(new Title { Text = "Population pyramid for Germany, midyear 2010" })
.SetSubtitle(new Subtitle { Text = "Source: www.census.gov" })
.SetXAxis(new[]
{
new XAxis
{
Categories = categories,
Reversed = false
},
new XAxis
{
Opposite = true,
Reversed = false,
Categories = categories,
LinkedTo = 0
}
})
.SetYAxis(new YAxis
{
Labels = new YAxisLabels { Formatter = "function(){ return (Math.abs(this.value) / 1000000) + 'M'; }" },
Title = new YAxisTitle { Text = "" },
Min = -4000000,
Max = 4000000
})
.SetTooltip(new Tooltip { Formatter = "TooltipFormatter" })
.SetPlotOptions(new PlotOptions { Bar = new PlotOptionsBar { Stacking = Stackings.Normal } })
.SetSeries(new[]
{
new Series
{
Name = "Male",
Data = new Data(new object[]
{
-1746181, -1884428, -2089758, -2222362, -2537431, -2507081, -2443179,
-2664537, -3556505, -3680231, -3143062, -2721122, -2229181, -2227768,
-2176300, -1329968, -836804, -354784, -90569, -28367, -3878
})
},
new Series
{
Name = "Female",
Data = new Data(new object[]
{
1656154, 1787564, 1981671, 2108575, 2403438, 2366003, 2301402, 2519874,
3360596, 3493473, 3050775, 2759560, 2304444, 2426504, 2568938, 1785638,
1447162, 1005011, 330870, 130632, 21208
})
}
});
return View(chart);
}
示例7: Waterfall
public ActionResult Waterfall()
{
Highcharts chart = new Highcharts("chart")
.InitChart(new Chart { Type = ChartTypes.Waterfall, Width = 600, Height = 400 })
.SetTitle(new Title { Text = "Highcharts Waterfall" })
.SetXAxis(new XAxis { Type = AxisTypes.Category })
.SetYAxis(new YAxis { Title = new YAxisTitle { Text = "USD" } })
.SetLegend(new Legend { Enabled = false })
.SetTooltip(new Tooltip { PointFormat = "<b>${point.y:,.2f}</b> USD" })
.SetSeries(new Series
{
UpColor = Color.FromName("Highcharts.getOptions().colors[2]"),
Name = "Observations",
Color = Color.FromName("Highcharts.getOptions().colors[3]"),
Data = new Data(new[]
{
new Point { Name = "Start", Y = 120000 },
new Point { Name = "Product Revenue", Y = 569000 },
new Point { Name = "Service Revenue", Y = 231000 },
new Point { Name = "Positive Balance", Color = Color.FromName("Highcharts.getOptions().colors[1]"), IsIntermediateSum = true },
new Point { Name = "Fixed Costs", Y = -342000 },
new Point { Name = "Variable Costs", Y = -233000 },
new Point { Name = "Balance", Color = Color.FromName("Highcharts.getOptions().colors[1]"), IsSum = true}
}),
PlotOptionsWaterfall = new PlotOptionsWaterfall
{
DataLabels = new PlotOptionsWaterfallDataLabels
{
Enabled = true,
Formatter = "function () { return Highcharts.numberFormat(this.y / 1000, 0, ',') + 'k'; }",
Style = "color: '#FFFFFF', fontWeight: 'bold'"
},
PointPadding = 0
}
}
);
return View(chart);
}
示例8: PieChartWithEvents
public ActionResult PieChartWithEvents()
{
Highcharts chart = new Highcharts("chart")
.InitChart(new Chart())
.SetPlotOptions(new PlotOptions
{
Pie = new PlotOptionsPie
{
AllowPointSelect = true,
Cursor = Cursors.Pointer,
ShowInLegend = true,
Events = new PlotOptionsPieEvents { Click = "function(event) { alert('The slice was clicked!'); }" },
Point = new PlotOptionsPiePoint { Events = new PlotOptionsPiePointEvents { LegendItemClick = "function(event) { if (!confirm('Do you want to toggle the visibility of this slice?')) { return false; } }" } }
}
})
.SetSeries(new Series
{
Type = ChartTypes.Pie,
Name = "Browser share",
Data = new Data(new object[]
{
new object[] { "Firefox", 45.0 },
new object[] { "IE", 26.8 },
new object[] { "Chrome", 12.8},
new object[] { "Safari", 8.5 },
new object[] { "Opera", 6.2 },
new object[] { "Other\\'s", 0.7 }
})
});
return View(chart);
}
示例9: ThemingTheResetButton
public ActionResult ThemingTheResetButton()
{
Highcharts chart = new Highcharts("chart")
.InitChart(new Chart
{
ZoomType = ZoomTypes.X,
ResetZoomButton = new ChartResetZoomButton
{
Theme = new Theme
{
Fill = Color.White,
Stroke = Color.Silver,
R = 0,
States = new ThemeStates
{
Hover = new ThemeStatesHover
{
Fill = ColorTranslator.FromHtml("#41739D"),
Style = "color: 'white'"
}
}
}
}
})
.SetTitle(new Title { Text = "Theming the reset button" })
.SetXAxis(new XAxis
{
Categories = new[] { "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" }
})
.SetSeries(new Series
{
Data = new Data(new object[] { 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4 })
});
return View(chart);
}
示例10: BubbleChart
public ActionResult BubbleChart()
{
Highcharts chart = new Highcharts("chart")
.InitChart(new Chart { DefaultSeriesType = ChartTypes.Bubble, ZoomType = ZoomTypes.Xy, Width = 600, Height = 400 })
.SetTitle(new Title { Text = "Highcharts Bubbles" })
.SetSeries(new[]
{
new Series
{
Data = new Data(new object[]
{
new object[] { 97,36,79 },
new object[] { 94,74,60 },
new object[] { 68,76,58 },
new object[] { 64,87,56 },
new object[] { 68,27,73 },
new object[] { 74,99,42 },
new object[] { 7,93,87 },
new object[] { 51,69,40 },
new object[] { 38,23,33 },
new object[] { 57,86,31 }
})
},
new Series
{
Data = new Data(new object[]
{
new object[] { 25,10,87 },
new object[] { 2,75,59 },
new object[] { 11,54,8 },
new object[] { 86,55,93 },
new object[] { 5,3,58 },
new object[] { 90,63,44 },
new object[] { 91,33,17 },
new object[] { 97,3,56 },
new object[] { 15,67,48 },
new object[] { 54,25,81 }
})
},
new Series
{
Data = new Data(new object[]
{
new object[] { 47,47,21 },
new object[] { 20,12,4 },
new object[] { 6,76,91 },
new object[] { 38,30,60 },
new object[] { 57,98,64 },
new object[] { 61,17,80 },
new object[] { 83,60,13 },
new object[] { 67,78,75 },
new object[] { 64,12,10 },
new object[] { 30,77,82 }
})
}
});
return View(chart);
}
示例11: EaseOutBounceEffect
public ActionResult EaseOutBounceEffect()
{
Highcharts chart = new Highcharts("chart")
.InitChart(new Chart { Type = ChartTypes.Column })
.SetTitle(new Title { Text = "EaseOutBounce Effect" })
.SetPlotOptions(new PlotOptions { Column = new PlotOptionsColumn { Animation = new Animation(new AnimationConfig { Duration = 2000, Easing = EasingTypes.EaseOutBounce }) } })
.SetXAxis(new XAxis
{
Categories = new[] { "Monday", "Tuesday", "Wednesday", "Thursday", "Friday" }
})
.SetSeries(new Series
{
Data = new Data(new object[] { 29.9, 71.5, 106.4, 129.2, 111 })
});
return View(chart);
}
示例12: BasicLine
public ActionResult BasicLine()
{
Highcharts chart = new Highcharts("chart")
.InitChart(new Chart
{
DefaultSeriesType = ChartTypes.Line,
MarginRight = 130,
MarginBottom = 25,
ClassName = "chart"
})
.SetTitle(new Title
{
Text = "Monthly Average Temperature",
X = -20
})
.SetSubtitle(new Subtitle
{
Text = "Source: WorldClimate.com",
X = -20
})
.SetXAxis(new XAxis { Categories = ChartsData.Categories })
.SetYAxis(new YAxis
{
Title = new YAxisTitle { Text = "Temperature (°C)" },
PlotLines = new[]
{
new YAxisPlotLines
{
Value = 0,
Width = 1,
Color = ColorTranslator.FromHtml("#808080")
}
}
})
.SetTooltip(new Tooltip
{
Formatter = @"function() {
return '<b>'+ this.series.name +'</b><br/>'+
this.x +': '+ this.y +'°C';
}"
})
.SetLegend(new Legend
{
Layout = Layouts.Vertical,
Align = HorizontalAligns.Right,
VerticalAlign = VerticalAligns.Top,
X = -10,
Y = 100,
BorderWidth = 0
})
.SetSeries(new[]
{
new Series { Name = "Tokyo", Data = new Data(ChartsData.TokioData) },
new Series { Name = "New York", Data = new Data(ChartsData.NewYorkData) },
new Series { Name = "Berlin", Data = new Data(ChartsData.BerlinData) },
new Series { Name = "London", Data = new Data(ChartsData.LondonData) }
}
);
return View(chart);
}
示例13: BoxPlot
public ActionResult BoxPlot()
{
Highcharts chart = new Highcharts("chart")
.InitChart(new Chart { Type = ChartTypes.Boxplot, Width = 600, Height = 400 })
.SetTitle(new Title { Text = "Highcharts Box Plot Example" })
.SetLegend(new Legend { Enabled = false })
.SetXAxis(new XAxis
{
Categories = new[] { "1", "2", "3", "4", "5" },
Title = new XAxisTitle { Text = "Experiment No." }
})
.SetYAxis(new YAxis
{
Title = new YAxisTitle { Text = "Observations" },
PlotLines = new[]
{
new YAxisPlotLines
{
Value = 932,
Color = Color.FromName("red"),
Width = 1,
Label = new YAxisPlotLinesLabel
{
Text = "Theoretical mean: 932",
Align = HorizontalAligns.Center,
Style = "color: 'gray'"
}
}
}
})
.SetSeries(new[]
{
new Series
{
Name = "Observations",
Data = new Data(new object[]
{
new object[] { 760, 801, 848, 895, 965 },
new object[] { 733, 853, 939, 980, 1080 },
new object[] { 714, 762, 817, 870, 918 },
new object[] { 724, 802, 806, 871, 950 },
new object[] { 834, 836, 864, 882, 910 }
})
},
new Series
{
Name = "Outlier",
Data = new Data(new object[,]
{
{ 0, 644 },
{ 4, 718 },
{ 4, 951 },
{ 4, 969 }
}),
Type = ChartTypes.Scatter,
Color = Color.FromName("Highcharts.getOptions().colors[0]"),
PlotOptionsScatter = new PlotOptionsScatter
{
Marker = new PlotOptionsScatterMarker
{
FillColor = new BackColorOrGradient(Color.FromName("white")),
LineWidth = 1,
LineColor = Color.FromName("Highcharts.getOptions().colors[0]")
}
}
}
}
);
return View(chart);
}
示例14: BasicColumn
public ActionResult BasicColumn()
{
Highcharts chart = new Highcharts("chart")
.InitChart(new Chart { DefaultSeriesType = ChartTypes.Column })
.SetTitle(new Title { Text = "Monthly Average Rainfall" })
.SetSubtitle(new Subtitle { Text = "Source: WorldClimate.com" })
.SetXAxis(new XAxis { Categories = new[] { "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" } })
.SetYAxis(new YAxis
{
Min = 0,
Title = new YAxisTitle { Text = "Rainfall (mm)" }
})
.SetLegend(new Legend
{
Layout = Layouts.Vertical,
Align = HorizontalAligns.Left,
VerticalAlign = VerticalAligns.Top,
X = 100,
Y = 70,
Floating = true,
BackgroundColor = new BackColorOrGradient(ColorTranslator.FromHtml("#FFFFFF")),
Shadow = true
})
.SetTooltip(new Tooltip { Formatter = @"function() { return ''+ this.x +': '+ this.y +' mm'; }" })
.SetPlotOptions(new PlotOptions
{
Column = new PlotOptionsColumn
{
PointPadding = 0.2,
BorderWidth = 0
}
})
.SetSeries(new[]
{
new Series { Name = "Tokyo", Data = new Data(new object[] { 49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4 }) },
new Series { Name = "London", Data = new Data(new object[] { 48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0, 59.6, 52.4, 65.2, 59.3, 51.2 }) },
new Series { Name = "New York", Data = new Data(new object[] { 83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 105.0, 104.3, 91.2, 83.5, 106.6, 92.3 }) },
new Series { Name = "Berlin", Data = new Data(new object[] { 42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1 }) }
});
return View(chart);
}
示例15: BasicBar
public ActionResult BasicBar()
{
Highcharts chart = new Highcharts("chart")
.InitChart(new Chart { DefaultSeriesType = ChartTypes.Bar })
.SetTitle(new Title { Text = "Historic World Population by Region" })
.SetSubtitle(new Subtitle { Text = "Source: Wikipedia.org" })
.SetXAxis(new XAxis
{
Categories = new[] { "Africa", "America", "Asia", "Europe", "Oceania" },
Title = new XAxisTitle { Text = string.Empty }
})
.SetYAxis(new YAxis
{
Min = 0,
Title = new YAxisTitle
{
Text = "Population (millions)",
Align = AxisTitleAligns.High
}
})
.SetTooltip(new Tooltip { Formatter = "function() { return ''+ this.series.name +': '+ this.y +' millions'; }" })
.SetPlotOptions(new PlotOptions
{
Bar = new PlotOptionsBar
{
DataLabels = new PlotOptionsBarDataLabels { Enabled = true }
}
})
.SetLegend(new Legend
{
Layout = Layouts.Vertical,
Align = HorizontalAligns.Right,
VerticalAlign = VerticalAligns.Top,
X = -100,
Y = 100,
Floating = true,
BorderWidth = 1,
BackgroundColor = new BackColorOrGradient(ColorTranslator.FromHtml("#FFFFFF")),
Shadow = true
})
.SetCredits(new Credits { Enabled = false })
.SetSeries(new[]
{
new Series { Name = "Year 1800", Data = new Data(new object[] { 107, 31, 635, 203, 2 }) },
new Series { Name = "Year 1900", Data = new Data(new object[] { 133, 156, 947, 408, 6 }) },
new Series { Name = "Year 2008", Data = new Data(new object[] { 973, 914, 4054, 732, 34 }) }
});
return View(chart);
}