- [C#] Lấy thông tin cấu hình máy tính xuất ra text file winform
- [C#] Chia sẽ class Install, Uninstall, Start và Stop Services Winform
- [C#] Tìm kiếm tập tin file nhanh chóng trên Winform sử dụng thư viện FastSearchLibrary
- [C#] Giới thiệu thư viện Fluent FTP Awesome dùng để làm việc với FTP
- [C#] Sử dụng thư viện Mini Profiler Integrations ghi log thực hiện các câu lệnh SQL
- [DEVEXPRESS] Thiết kế Dropdown ButtonBarItem trên Form Ribbon
- [C#] Lưu trạng thái các control trên Winform vào Registry Windows
- [C#] Ứng dụng ví dụ Simple Observer Pattern tăng giảm số lượng trên winform
- [C#] Hướng dẫn lấy thời gian thực server time trên winform
- [DEVEXPRESS] Hướng dẫn bật tính năng Scroll Pixcel in Touch trên GridView
- [DEVEXPRESS] Hướng dẫn sử dụng TileBar viết ứng dụng duyệt hình ảnh Winform
- [DEVEXPRESS] Tô màu border TextEdit trên Winform
- [C#] Lấy dữ liệu từ Console Write hiển thị lên textbox Winform
- [C#] Hiển thị Progress bar trên Window Console
- [C#] Di chuyển control Runtime và lưu layout trên winform
- [SQLSERVER] Sử dụng hàm NULL IF
- [C#] Chia sẽ source code mã đi tuần bằng giao diện Winform
- [C#] Flash Window in Taskbar Winform
- Download và Giải nén tập tin File sử dụng Powershell
- [C#] Hướng dẫn cách lấy thông tin đăng nhập tài khoản và mật khẩu web browser trên windows
Hướng dẫn sử dụng thư viện HighCharts để vẽ biểu đồ.
Hôm nay, mình xin giới thiệu các bạn thư viện Highcharts để vẽ biểu đồ số liệu. Hiện tại thư viện highcharts js hỗ trợ rất nhiều biểu đồ phổ biến: Biểu đồ hình tròn, hình cột, Pareto, bar...
Biểu đồ sử dụng thư viện vẽ có giao diện như hình bên dưới:
Source code:
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
$(function () {
$('#container').highcharts({
title: {
text: 'Monthly Average Temperature',
x: -20 //center
},
subtitle: {
text: 'Source: WorldClimate.com',
x: -20
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
title: {
text: 'Temperature (°C)'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
valueSuffix: '°C'
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
borderWidth: 0
},
series: [{
name: 'Tokyo',
data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
}, {
name: 'New York',
data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
}, {
name: 'Berlin',
data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
}, {
name: 'London',
data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
}]
});
});
- Dưới đây là demo cơ bản, nếu các bạn có thắc mắc gì có thể comment để dưới.
Cám ơn các bạn đã xem bài viết. Hãy like and share giúp mình nha các bạn.
Các bạn có thể Đăng ký kênh Youtube của mình ở góc phải bên trên màn hình.
Mọi thắc mắc về bài viết các bạn có thể hỏi ở http://hoidap.laptrinhvb.net để được support.