Html vẽ đường
|
- Quản lý các thành phần không tốt lắm nên việc chuyển đổi màu sắc giống nhau khi nhiều khối phải mất một chút thời gian để chọn nhiều thành phần - Xuất dưới các định dạng như xml, html nhưng lại bị mã hóa Các bước để tạo một biểu đồ vẽ trên trang. io
Trước khi bắt đầu tạo khối cho biểu đồ, bạn phải chỉnh lại "Kích thước giấy" trước khi vẽ (vì đây là trang web thiết kế dành chủ yếu cho việc trong ấn và hiển thị trên giấy chứ không phải dành cho trang web), Ở đây có 1 mẹo để kích thước thiết kế được chính xác bằng cách nhấn vào chữ "Ảnh" Cạnh nền và nhập vào đó 1 bức ảnh nhỏ có chiều dài (tính bằng px) như mong muốn, dựa vào đó bạn có thể thực hiện được Sau khi đã được kích thước như ý, việc tiếp theo bạn cần làm là sử dụng các công cụ có sẵn của trang web để tạo ra biểu đồ (hình bên dưới) Cạnh trên đầu là khung điều chỉnh cơ bản như phóng to thu nhỏ, xóa Phía bên tay trái của màn hình là khối hình được tạo sẵn, bạn chỉ cần kéo vào và căn chỉnh cho đúng với ý muốn của mình. Bạn có thể mở các lớp khác nhau để chọn khung hình mà mình mong muốn Giữa trang là khu vực vẽ chính. Để tạo liên kết giữa 2 khối chữ nhật chúng ta cần 1 đường kẻ để nối chúng với nhau, bạn chỉ việc chọn vào hình mũi tên ở khung bên trái thì sẽ tự động thêm vào khung hình Tiếp theo, bạn chọn vào đường mũi tên vừa hiển thị nó sẽ hiển thị các điểm khớp (điểm) kết nối màu xanh da trời, nhấp vào ô màu xanh phía sau và kéo vào các khung xuất phát "Nhập biểu đồ". Làm tương tự với các khung thành phần 1 và ta sẽ có 1 đường nối liên kết 2 khung với nhau "Lưu ý khi bạn kéo khớp màu xanh vào khung thì các khung sẽ hiển thị dấu x là vị trí bắt khớp của khung hình đó cùng với màu xanh lá cây tròn để bạn dễ dàng bắt khớp vị trí mong muốn." Phía bên tay phải của màn hình là các khung điều chỉnh các thuộc tính của khung hình, văn bản và các đường nối (dòng) giữa các khung từ màu sắc đến hình ảnh hiển thị của chúng Để sử dụng các thành phần con trong biểu đồ được dễ dàng hơn bạn cần truy cập một công cụ quản lý đó là "Lớp". Để bật thành phần này, bạn có thể chọn các khung phía trước trên màn hình (chọn 3 ô hình lồng nhau) hoặc nhấn tổ hợp phím "Ctrl + Shift + L", khi đó màn hình sẽ hiển thị thêm 1 khung có tên là lớp. Bạn có thể thêm các lớp khác nhau (dấu cộng) để dễ quản lý hoặc thêm 1 khung thành phần nào đó vào lớp tương ứng (dấu mũi tên đi vào khung hình)
Bạn nhấn vào "tập tin" và chọn "Lưu" (hoặc nhấn Ctrl + S) lựa chọn này sẽ tự động lưu trực tiếp tập tin của bạn mà không chỉnh sửa gì cả. Ngoài ra còn 1 cách khác để xuất ra định dạng html và các định dạng khác đó là "Xuất dưới định dạng" (ở đây có rất nhiều định dạng để bạn lựa chọn) Bước 5. Hiển thị trên trang web Khi hiển thị sẽ có 1 khung bao, nhấn vào sẽ bật lên bật hiển thị toàn ảnh của biểu đồ mình vừa vẽ. Đối với những trang web không quan tâm nhiều đến hiển thị này, thì có thể để như vậy tuy nhiên những trang web không muốn cái khung hiển thị đó thì làm sao ? To could filter out the section is not be frames, then you doing more 1 step nữa Bạn mở tệp html (biểu đồ ) bạn vừa tạo trên 1 trình duyệt web bất kỳ (ở đây tôi chọn chrome) Chỉ vào trong các khung (có thể là thành phần tổng) nhấn chuột phải chọn kiểm tra (hoặc nhấn Ctrl + Shift + I) Ở các khung mới hiển thị ở bên dưới, bạn kéo thanh cuộn lên trên và chọn dòng có chữ SVG ở đầu (hình bên dưới) Tiếp theo, đóng hình tam giác lại (trước chữ SVG) và chuột phải chọn "sao chép" -> "copyouterHTML" sau đó "dán" nội dung vừa sao chép vào 1 tệp html mới hoặc trực tiếp vào tệp bất kỳ bạn cần và lưu lại |
