Chuyển tới nội dung chính
Z Chart Maker

Trình tạo biểu đồ đường

Dán CSV để có ngay biểu đồ đường trực quan. Hỗ trợ nhiều chuỗi dữ liệu, thanh trượt làm mượt đường cong, xuất PNG. Miễn phí, chạy hoàn toàn trên trình duyệt.

Miễn phí Không cần đăng ký Chạy trên trình duyệt Tôn trọng riêng tư Updated

Cách dùng

  1. 1 Dán dữ liệu CSV — dòng đầu tiên là tiêu đề cột, cột đầu tiên là trục X (nhãn), các cột còn lại trở thành từng chuỗi dữ liệu (dataset).
  2. 2 Điều chỉnh thanh trượt độ cong để đường biểu đồ mượt hơn hoặc sắc nét hơn.
  3. 3 Tải biểu đồ đã dựng xuống dưới dạng PNG, sẵn sàng dùng cho slide hoặc tài liệu.

Vì sao dùng công cụ này

  • Chạy trên nền Chart.js, được tải lazy (lazy-load) — trang vẫn nhẹ cho đến khi bạn cuộn tới phần xem trước.
  • Phân tích CSV theo chuẩn RFC 4180 — xử lý đúng dấu phẩy trong ngoặc kép và ký tự xuống dòng nằm trong ô dữ liệu.
  • Không tải lên server — dữ liệu của bạn không bao giờ rời khỏi trình duyệt.
  • Nhiều chuỗi dữ liệu trong một biểu đồ — mỗi cột số sẽ trở thành một đường riêng biệt.

Câu hỏi thường gặp

Tôi có thể tìm thêm loại biểu đồ khác ở đâu?

Hãy xem các công cụ <a class="underline" href="/bar-chart-maker">Trình tạo biểu đồ cột</a>, <a class="underline" href="/pie-chart-maker">biểu đồ tròn</a>, <a class="underline" href="/doughnut-chart-maker">biểu đồ vành khuyên</a> và <a class="underline" href="/scatter-plot-maker">biểu đồ phân tán</a> — tất cả đều dùng chung định dạng CSV đầu vào.

Nếu dữ liệu của tôi ở dạng JSON thì sao?

Hãy chuyển đổi trước bằng công cụ <a class="underline" href="/csv-to-json">chuyển đổi CSV ↔ JSON</a>, sau đó dán CSV vào đây.

Vì sao một số ô bị bỏ qua?

Các ô không phải số trong cột dữ liệu sẽ thành null. Cột đầu tiên được xem là chuỗi nhãn, còn tất cả các cột khác phải là số hợp lệ mới vẽ được lên biểu đồ.

Trình tạo biểu đồ đường là gì?

Trình tạo biểu đồ đường (Line Chart Maker) là công cụ chuyển dữ liệu CSV bạn dán vào thành biểu đồ đường ngay trong trình duyệt. Công cụ vẽ một hoặc nhiều chuỗi dữ liệu dưới dạng các điểm nối liền theo trục, có thanh trượt để làm mượt đường cong giữa các điểm, và xuất kết quả thành ảnh PNG — toàn bộ quá trình xử lý diễn ra phía trình duyệt (client-side), không có dữ liệu nào được tải lên server.

Tính năng

Biểu đồ đường đa chuỗi dữ liệu

Mỗi cột số sau cột đầu tiên trở thành một tập dữ liệu đường riêng biệt, tự động tô màu từ bảng màu cố định gồm 10 màu, tất cả được vẽ trên cùng nhãn trục X lấy từ cột đầu tiên.

Thanh trượt điều chỉnh độ cong đường

Thanh trượt trong khoảng từ 0 đến 0.6 thiết lập độ căng đường (line tension) của Chart.js theo thời gian thực — làm mượt đường cong Bezier — từ các đoạn thẳng sắc nét (0) đến đường cong mượt mà (0.6).

Phân tích CSV theo chuẩn RFC 4180

Trình phân tích không phụ thuộc thư viện ngoài xử lý các trường có dấu ngoặc kép, dấu phẩy nhúng bên trong, dấu ngoặc kép được escape và ký tự xuống dòng CR/LF; dấu phân tách (dấu phẩy, chấm phẩy, dấu gạch đứng hoặc tab) được tự động phát hiện từ dòng đầu tiên.

Chỉ xử lý phía client, xuất PNG

Chart.js được tải theo kiểu lazy-load và toàn bộ quá trình render diễn ra hoàn toàn trong canvas của trình duyệt — không có dữ liệu nào rời khỏi thiết bị — và kết quả được tải xuống dưới dạng PNG thông qua canvas.toDataURL('image/png').

Ví dụ

Input

Month,Visitors,Signups
Jan,1200,80
Feb,1500,110
Mar,1800,150
Apr,2200,180
May,2700,260
Jun,3100,320

Output

line-chart-maker.png — two lines ("Visitors" in #10b981, "Signups" in #0ea5e9) plotted over 6 X-axis points (Jan–Jun), default curve tension 0.35, legend shown, rendered at the canvas's on-screen resolution and downloaded as a PNG data URL.

Trường hợp sử dụng

  1. 1

    Trực quan hóa số liệu theo thời gian cho báo cáo

    Dán số liệu theo tháng hoặc theo tuần (lượt truy cập, doanh thu, lượt đăng ký) với ngày tháng ở cột đầu tiên để nhận được biểu đồ xu hướng nhiều đường sẵn sàng đưa vào slide thuyết trình hoặc tài liệu.

  2. 2

    So sánh nhiều chuỗi dữ liệu mà không cần ứng dụng bảng tính

    Mỗi cột CSV bổ sung được vẽ thành một đường riêng trên cùng hệ trục, hữu ích để nhanh chóng so sánh hai hoặc ba chỉ số liên quan cạnh nhau.

  3. 3

    Biến dữ liệu CSV xuất ra thành hình ảnh có thể chia sẻ

    Xuất dữ liệu từ công cụ phân tích, bảng tính hoặc cơ sở dữ liệu dưới dạng CSV, dán vào công cụ và tải xuống biểu đồ PNG mà không cần cài đặt phần mềm vẽ biểu đồ hay viết code.

Tóm tắt

Line Chart Maker chuyển đổi văn bản CSV được dán vào thành biểu đồ đường Chart.js ngay trên trình duyệt: hàng đầu tiên được đọc làm tiêu đề, cột đầu tiên làm nhãn trục X, và mỗi cột số còn lại trở thành một chuỗi dữ liệu đường riêng với màu sắc lấy từ bảng màu cố định gồm 10 màu. Công cụ sử dụng một trình phân tích CSV tự viết tuân thủ RFC 4180 (không dùng thư viện CSV bên ngoài) và tải Chart.js 4.5.1 theo kiểu lazy-load để render lên canvas, nên engine biểu đồ chỉ được tải khi bạn thực sự sử dụng công cụ. Toàn bộ quá trình phân tích và render diễn ra hoàn toàn phía client — dữ liệu CSV bạn dán vào không bao giờ được tải lên máy chủ — và biểu đồ hoàn chỉnh được xuất ra dưới dạng PNG thông qua phương thức toDataURL() của canvas.

Danh mục
Sáng tạo
Giá
Miễn phí
Quyền riêng tư
Chạy trên trình duyệt
Đăng ký
Không cần

Tài liệu tham khảo

Quyền riêng tư

Dữ liệu của bạn không bao giờ rời khỏi trình duyệt trừ khi được nêu rõ. Trình tạo biểu đồ đường chạy hoàn toàn phía client — không tải lên máy chủ, không ghi log, không theo dõi dữ liệu bạn nhập.

Xây dựng, chia sẻ và phát triển trên Zerethon Social

Đăng ký miễn phí. Kiếm điểm, sưu tầm thành tựu và kết nối với nhà sáng tạo khắp thế giới.

Dùng thử Zerethon miễn phí