Computer >> Máy Tính >  >> Kết nối mạng >> Internet

Tạo biểu đồ tuyệt đẹp với FusionCharts

Bạn có một ông chủ dễ dàng bị ấn tượng bởi những thủ thuật thị giác lạ mắt, bất kể nội dung như thế nào? Bạn có phải là một loại người tiếp thị? Bạn sở hữu một trang web và muốn làm sống động các trang bằng một số biểu đồ flash tuyệt đẹp? Bạn có yêu cầu các công cụ trình bày trực tuyến ngoài các trang Web tĩnh không? Sau đó, bạn nên xem FusionCharts.

FusionCharts là một phần mềm lập biểu đồ Flash cho phép bạn tích hợp các đồ thị và biểu đồ Flash sinh động, dễ chịu về mặt thẩm mỹ vào các dự án Web của bạn. FusionCharts cung cấp nhiều loại biểu đồ 2D và 3D, bao gồm diện tích, thanh, bánh, cột, phân tán và nhiều biểu đồ khác, tất cả đều có thể được sử dụng với các tệp HTML đơn giản hoặc ASP, PHP, Ruby on Rail, Python và các trang web khác công nghệ. FusionCharts cũng hoạt động với cơ sở dữ liệu, như SQL và Oracle.

FusionCharts là một trong nhiều sản phẩm của InfoSoft. Trong số các dịch vụ khác, bạn sẽ tìm thấy các tiện ích Flash cho bảng điều khiển, bản đồ Flash và biểu đồ tương tác cho Adobe Flash, Dreamweaver, FileMaker, Visual Basic và Google Gadgets.

Tất cả các chương trình này đều phải trả tiền, nhưng FusionCharts cũng có phiên bản miễn phí! Mặc dù kém mạnh mẽ hơn so với giải pháp phần mềm trả phí, nhưng FusionCharts Free là quá đủ cho hầu hết người dùng gia đình. Hơn nữa, nó rất không xâm phạm, không có nhãn hiệu hình mờ kiểu phần mềm chia sẻ.

Có mưu đồ? Vâng, hãy để tôi chỉ cho bạn cách bạn có thể thiết lập FusionCharts. Trong hướng dẫn này, tôi sẽ trình bày với FusionCharts v3, bạn có thể dùng thử một thời gian. Vâng, tôi để lại tất cả các khía cạnh pháp lý cho bạn. Để so sánh giữa hai, vui lòng kiểm tra trang sau.

Tải xuống và thiết lập

Bạn sẽ phải đăng ký để tải xuống FusionCharts. Sau khi bạn đã tải tệp lưu trữ xuống máy của mình, hãy giải nén tệp zip đã tải xuống vào bất kỳ thư mục nào bạn chọn.

Những bước đầu tiên

Mở thư mục mà bạn vừa giải nén FusionCharts. Bạn sẽ nhận thấy rằng nó chứa khá nhiều thư mục con.

Tạo biểu đồ tuyệt đẹp với FusionCharts

Tệp là tệp tài liệu/trợ giúp sẽ giúp bạn tạo dự án Web đầu tiên của mình và sử dụng FusionCharts bên trong dự án đó. Bạn nên dành thời gian đọc hướng dẫn, nhưng bạn cũng có thể đọc lướt qua bài viết của tôi.

Tạo dự án

Bạn cần tạo một thư mục cho dự án của mình. Khi bạn đã tạo nó, hãy sao chép tất cả các tệp có trong thư mục con Charts vào thư mục dự án của bạn. Bạn sẽ nhận thấy các tệp này ở định dạng SWF. Tiếp theo, sao chép tệp FusionCharts.js từ thư mục JSClass vào thư mục dự án của bạn.

Lưu ý:Người dùng phiên bản phần mềm miễn phí cũng sẽ có sẵn tập lệnh. Tuy nhiên, bộ sưu tập các loại biểu đồ có sẵn sẽ nhỏ hơn. Vui lòng tham khảo so sánh ở trên để biết thêm chi tiết.

Tất nhiên, bạn không thực sự phải làm điều này, bạn có thể sử dụng bất kỳ thư mục nào bạn muốn và sau đó sử dụng các đường dẫn tương đối trong mã Web của bạn để trỏ đến các tệp phù hợp, giống như bạn làm với bất kỳ dự án Web nào. Tuy nhiên, lần đầu tiên bạn sử dụng FusionCharts, sẽ dễ dàng hơn nếu trang Web, tập lệnh và biểu đồ Flash đều nằm trong cùng một thư mục.

Bước tiếp theo là sao chép và tạo dữ liệu của bạn cho biểu đồ. FusionCharts yêu cầu bạn sử dụng XML làm bộ chứa dữ liệu.

Tạo dữ liệu

Trong phiên bản miễn phí, bạn sẽ phải tự tạo tệp bằng trình chỉnh sửa văn bản. Phiên bản v3 đầy đủ tính năng cho phép bạn sử dụng Tiện ích Trình tạo XML, tiện ích này thực sự tiện dụng vì tiện ích này cho phép bạn tự động chuyển đổi cài đặt của mình sang HTML hoặc mã có liên quan.

Trình tạo XML có thể được tìm thấy trong thư mục con Công cụ.

Tạo biểu đồ tuyệt đẹp với FusionCharts

Tạo biểu đồ tuyệt đẹp với FusionCharts

Nhập dữ liệu theo bất kỳ cách nào bạn muốn. Sau khi hoàn tất, hãy nhấp vào Chuyển đổi sang XML.

Tạo biểu đồ tuyệt đẹp với FusionCharts

Dữ liệu của bạn bây giờ sẽ hiển thị ở định dạng XML. Như tôi đã đề cập trước đó, bạn có thể tự tạo tệp bằng cách sử dụng trình soạn thảo văn bản, chẳng hạn như Notepad. Thật vậy, bạn sẽ phải sao chép mã vào trình soạn thảo văn bản và lưu tệp dưới dạng something.xml.

Hướng dẫn FusionCharts khuyên bạn nên gọi tệp Data.xml. Nếu bạn không thoải mái với việc tự chỉnh sửa các tệp HTML, thì bạn chắc chắn nên sử dụng tên mặc định. Nếu không, bạn có thể sử dụng bất kỳ tên nào bạn muốn.

Tạo biểu đồ tuyệt đẹp với FusionCharts

Nhấp vào Configure Chart để tùy chỉnh giao diện của biểu đồ. Bạn có thể thêm tiêu đề và tiêu đề phụ cho biểu đồ của mình và các trục, thay đổi bảng màu, hiển thị các giá trị trong biểu đồ và các thuộc tính liên quan khác.

Tạo biểu đồ tuyệt đẹp với FusionCharts

Tiếp theo, nhấp vào Tạo HTML để tạo tệp của bạn. Tại đây, bạn có thể chọn loại biểu đồ. Giá trị này trỏ trực tiếp đến các tệp SWF mà chúng tôi đã sao chép trước đó, vì vậy nếu bạn chỉ sao chép một phần con của các tệp biểu đồ từ thư mục con Biểu đồ, hãy đảm bảo rằng bạn có chúng trong thư mục dự án của mình. Nếu không, dự án của bạn sẽ không thực sự hoạt động. Nó giống như không có tệp hình ảnh ở nơi đáng lẽ phải có.

Bạn cũng có thể thay đổi chiều rộng và chiều cao của biểu đồ. Bạn có thể chỉnh sửa thủ công điều này sau bằng cách thay đổi mã HTML.

Tạo biểu đồ tuyệt đẹp với FusionCharts

Cuối cùng, sao chép nội dung vào trình soạn thảo văn bản và tạo tệp HTML của riêng bạn. Gọi nó là bất cứ điều gì bạn muốn. Để biết thêm chi tiết, vui lòng tham khảo tệp đi kèm với gói đã tải xuống.

Xem lại dữ liệu

Hãy xem các tập tin của chúng tôi. Đây là tệp Data.xml:

Tạo biểu đồ tuyệt đẹp với FusionCharts

Như bạn có thể thấy, đó là XML tiêu chuẩn. Bạn có thể chỉnh sửa tệp này trực tiếp nếu muốn hoặc biết cách. Bạn có thể thay đổi các giá trị và khóa, bạn có thể chỉnh sửa chú thích biểu đồ, v.v.

Đây là tệp HTML:

Tạo biểu đồ tuyệt đẹp với FusionCharts

Có hồ sơ của chúng tôi. Bit bạn muốn được chứa giữa hai nhận xét, Mã bắt đầu cho biểu đồ FusionCharts và Mã kết thúc cho biểu đồ FusionCharts. Bạn có thể sao chép nó vào bất kỳ dự án nào bạn muốn. Lưu ý các đường dẫn tương đối đến tệp .js, tệp .swf, kích thước biểu đồ, v.v. Bạn có thể tùy chỉnh tất cả những đường dẫn này khi thấy phù hợp. Bây giờ, hãy xem FusionCharts có thể làm gì.

Đồ thị tuyệt vời

Đây rồi, những thứ thực sự lạ mắt, một số bánh nướng 2D và 3D:

Tạo biểu đồ tuyệt đẹp với FusionCharts

Tạo biểu đồ tuyệt đẹp với FusionCharts

Một ví dụ khác, thanh 3D:

Tạo biểu đồ tuyệt đẹp với FusionCharts

Hãy xem những biểu đồ đáng yêu này trông như thế nào khi được tích hợp vào một trang web, với một số văn bản trước và sau biểu đồ, tạo nên một bài viết rất hay:

Bây giờ, phần hay nhất là, bạn có thể thao tác với đồ thị, xoay chúng, tách các bit dữ liệu, tất cả các loại thủ thuật thú vị. Tất nhiên, bạn phải kích hoạt Javascript và cài đặt plugin Flash để toàn bộ công việc hoạt động.

Các biểu đồ cũng có một hình ảnh động đầu vào đáng yêu khi được tải, bổ sung thêm phong cách. Đây là giao diện của nó, được ghi lại bằng Wink:

Tóm tắt nhỏ

Trước khi tôi đi đến phần Kết luận [sic], đây là danh sách ngắn các bước bạn cần thực hiện để thiết lập và chạy FusionCharts:

  • Tải xuống và giải nén tệp lưu trữ.
  • Sao chép tệp Flash (định dạng .swf bên trong Biểu đồ) và tệp Javascript (.js, bên trong JSClass) vào tệp dự án của bạn. Bạn có thể sử dụng một thư mục hoặc một số vị trí. Người dùng ít hiểu biết hơn có lẽ nên sử dụng một thư mục dự án thống nhất, duy nhất.
  • Tạo dữ liệu biểu đồ, sao chép vào tệp văn bản và lưu dưới dạng Data.xml.
  • Tạo mã HTML, tùy chỉnh nó và sao chép nó vào một tệp văn bản và lưu nó; đặt tên cho nó theo bất kỳ cách nào bạn thích. Bạn có thể sử dụng đường dẫn tương đối hoặc tuyệt đối cho vị trí của tất cả các tệp có liên quan. Người dùng nâng cao sẽ điều chỉnh thiết lập theo bất kỳ cách nào họ muốn.
  • Tải tệp HTML mới tạo bên trong trình duyệt Web và bắt đầu thưởng thức các biểu đồ thú vị của bạn. Thay đổi các khóa, giá trị, chú thích, kích thước, loại, bảng màu cho phù hợp với nhu cầu của bạn.

Như bạn có thể thấy, thiết lập FusionCharts không phải là một thỏa thuận plug-and-play, nhưng chắc chắn là có thể thực hiện được. Nếu bạn đã quen thuộc với một số loại thiết kế Web, thì tại sao bạn lại không làm như vậy nếu bạn có ý định sử dụng công nghệ trình bày trực tuyến, thì việc sử dụng FusionCharts sẽ rất dễ dàng đối với bạn. Nếu bạn là người mới, sẽ có một số công việc phía trước bạn, nhưng hy vọng hướng dẫn của tôi đã làm cho nó trở nên đơn giản.

Kết luận

FusionCharts chắc chắn là một công nghệ độc đáo, hữu ích. Nó cho phép bạn làm phong phú thêm các bài thuyết trình trực tuyến của mình một cách nhanh chóng và dễ dàng. Trên hết, bạn không cần phải là chuyên gia viết mã để sử dụng FusionCharts. Công việc khó khăn đã được hoàn thành, bạn chỉ cần làm cho những biểu đồ lạ mắt đó phù hợp trên các trang Web của mình.

Kết hợp với Wink và có lẽ là Slidy, bạn sẽ được thưởng thức. Nếu bạn nghiêm túc về nó, bạn thậm chí có thể cân nhắc mua phiên bản phần mềm trả phí đầy đủ.

Tôi hy vọng bạn thích hướng dẫn này. Hẹn gặp lại bạn.

Chúc mừng.