Hướng dẫn sử dụng Charticulator: Phần 8: Scales và Legend

Trong phần này chúng ta sẽ tìm hiểu vè scales và legend. chúng ta sẽ biết cách thêm scales, tinh chỉnh scales và thêm legend cũng như tinh chỉnh legend trong chart như thế nào. Với phần này chúng ta có thể tạo ra các chart số cho line chart, bubble chart v.v.

Scales and Legends

Charticulator Scales

Mỗi khi bạn gắn một biến vào một attribute thì Charticulator sẽ tự động tạo ra một scale và sau đó chúng

ta cần tạo legend để giải thích cho scale đó

Có 3 loại scale: numerical scale, color scales, và scale dùng để map image vào icon marks

Trong ví dụ trên chúng ta có scale 1 là một numerical scale vì chúng ta bỏ biến sale và height attribute của shape và chúng ta cũng thêm một legend vào trục tung để giải thích cho scale đó

Scale 2 là một color scale vì chúng ta bỏ biến saleperson vào fill attribute và chúng ta cũng thêm legend cho scale này

Properties of the Scale

Color scales dùng cho các biến phân loại được gắn vào các attribute (và cũng có thể dùng cho các biến định lượng được gắn vào các attribute không phải số) Scale numerical ngược lại dùng cho các attribute được gắn cùng hay khác loại biến số

Trong Example 1: hai biến phân loại khác nhau được gắn vào các attribute tạo thành hai color scales Trong scale1 một bến phân loại được gắn vào fill và stroke attribute của shape Trong scale2 một biến phân loại khác được gắn vào fill and stroke của một symbol

Trong example 2: có thể cùng một biến số hay ba biến số khác nhau được gắn vào 3 attribute khác nhau Khi gắn một biến số vào một attribute số thì nó luôn tạo ra một scale mới cho dù biến số đó có là cùng hay là khác nhau

Trong example 3: cùng biến số hay các biến số khác nhau được gắn vào cùng attribute của hai shape khác nhau và hai symbols khác nhau

Color Scales

Colore scale sẽ được tạo ra khi bạn gắn một trường vào một attribute có màu sắc đi kèm như fill, stroke (cho đường viền) hay color (cho text mark) Nếu bạn gắn biến phân loại vào một trong các attribute này thì Charticulator sẽ tự động gán các màu khác nhau cho từng phân loại của biến từ đó tạo ra color scale Nếu bạn gắn một biến số vào attribute thì sẽ tạo ra gradient color scale với giá trị cao và thấp

Editing Color Scales

Để tinh chỉnh color của color scale bằng cách click vào attribute hay click vào tên riêng của scale pane và chọn màu mà bạn muốn

Để tinh chỉnh màu cho biến phân loại chúng ta click chọn màu sau đó chọn lại màu khác từ color pallete

Để tinh chỉnh màu cho biến định lượng chúng ta chọn loại pallette mà chúng ta muốn

Numerical Scales

Numerical scale được tạo ra khi bạn gắn biến số vào attribute số chẳng hạn như height, width, size hoặc X span/Y span

Lưu ý rằng một gradient color scalesẽ được áp dụng cho tất cả các biến số được gắn vào cùng một attribute

và gradient color scale sẽ được chọn tùy theo biến số đầu tiên được gắn Ví dụ chúng ta có scale1 có shape1.Height và shape2.height trong đó hai trường số khác nhau được gắn vào attribute Height của hai rectangle khác nhau Khi trường thứ hai được gắn vào attribute height thì scale đã được xác định theo trường số thứ nhất được gắn vào attribute height

Ví dụ chúng ta có hai trường số “2019 sales” và “2020 sales” được gắn vào height attribute của hai rectangles marks

Chúng ta thấy các rectangle của 2020 sales tràn ra khỏi khung vẽ

Điều này liên quan đến việc chúng ta gắn các biến số vào các rectangles Đầu tiên chúng ta tạo rectangles đính vào các guides (guides trên, dưới và giữa), sau đó gắn biến “2019 sales” vào height của rectangle này Tiếp theo chúng ta vẽ một rectangle khác bắt đầu từ top guide và gắn vào cạnh dọc và bottom guide, sau

đó chúng ta gắn vào “2020 sales”

Vì khi gắn 2019 sales vào height của shape1 do đó scale1 sẽ có giá trị tối đa và tối thiểu của 2019 sales Trong khi đó 2020 sales có giá trị lớn hơn so với giá trị tối đa của 2019 sales vì vậy các thanh của 2020 sales tràn ra ngoài khung đồ thị Ví dụ này cho thấy scale1 của cả hai rectangles phụ thuộc hoàn toàn vào biến số đầu tiên được gắn vào attribute

Để khắc phục tình trạng trên chúng ta chỉ cần gắn 2020 sales vào height trước sau đó mới đến 2019 sales

Editing Numerical Scales

Chúng ta cũng có thể tùy chỉnh numerical scale bằng cách click vào attribute đó hoặc chọn scale trong scale pane

Khi chọn scale trong scale pane sẽ xuất hiện cửa sổ lựa chọn thay đổi Domain và Range

Range của một mark hay line sẽ quyết định khoảng cách khác biệt giữa glyph nhỏ nhất và lớn nhất Ví dụ thay đổi range trong rectangle sẽ thay đổi khoảng cách giữa rectangle cao nhất và thấp nhất

Trong thực tế khi vẽ mark hoặc line Charticulator tự động chỉnh range cho hình Do đó khi bạn thay đổi range thì hình cũng sẽ bị thay đổi hiển thị trong khung vẽ

Khi vẽ symbol thì Charticulator cũng tự động tạo range cho symbol với giá trị End là mặc định phù hợp giũa symbol và khung vẽ Nếu chúng ta thay đổi giá trị End này thì kích thước của symbol có thể tăng hoặc giảm mà không chịu ảnh hưởng của khung vẽ

Creating Additional Scales When Mapping Data

Trong trường hợp hai biến số có cùng đơn vị thì chúng ta có thể sử dụng cùng mộ scale cho hai biến số Tuy nhiên nếu hai biến số khác đơn vị ví dụ như sale và quantity thì chúng ta phải thêm vào một scale thứ hai cho hai biến số Tương tự như vậy khi chúng ta muốn hiển thị hai scale khác nhau cho hai biến phân loại thì chúng ta cũng phải dùng hai scale màu khác nhau cho hai biến phân loại

Trong hình ở phía trên fill attribute của shape1 dùng color scale 1 còn fill attribute của symbol1 lại dùng color scale thứ hai (gồm hai màu đỏ và xanh)

Trong hình ở dưới height của shape1 dùng numerical scale 1 còn height của shape2 lại dùng numerical scale 2

Để tạo ra scale thứ hai cho biến phân loại hoặc biến số thứ hai chúng ta phải nhấn giữa phím SHIFT khi chúng ta kéo thả biến số vào attribute

Khi bạn làm như vậy bạn sẽ thấy một scale mới xuất hiện trong scale pane

Reusing Scales

Bạn cũng có thể sử dụng scale cho nhiều attribute khác nhau

Trong hình trên chúng ta muốn dùng scale2 của fill attribute cho stroke attribut chúng ta chỉ cần nắm lấy shape1.fill và bỏ vào stroke attribute

Charticulator Legends

Có hai loại legend là “column name” và “column values”

Creating Legends

Một cách để tạo legend chính là dùng thẻ legend trong toolbar của khung vẽ Đây là cách duy nhất để chúng

ta tạo nên column name legend Đối với column value legend cách này chỉ tạo ra legend mặc định của các biến số trong dữ liệu Nó không tạo ra legend cho các biến đã gắn vào attribute Ví dụ nếu chúng ta gắn biến sale vào gradient color scale và numerical scale thì khi dùng thẻ legend chúng ta không thể tạo ra gradient color scale được

Cách thứ hai là chúng ta dùng scale pane Chỉ cần nhấn vào scale pane và chọn add legend thì Charticulator

sẽ tạo legend cho biến số gắn vào attribute đó Với cách làm này chúng ta vừa có thể chỉnh scale vừa có thể tạo legend, vô cùng tiện lợi

Column Values Legends

Khi sử dụng column values legend Charticulator sẽ tạo ra ba loại khác nhau tùy vào biến gắn vào attribute:

- Category legend: legend sẽ map lại các màu cho các category

- Gradient legend: legend sẽ là các giá trị được trình bày theo sắc độ

- Numerical legend: legen sẽ trình bày các giá trị của biến số Tuy nhiên legend này sẽ không tác động đến

dữ liệu được vẽ trong chart

Column Names Legends

Chúng ta có thể chèn column names legend trong trường hợp chúng ta có nhiều biến số Chúng ta tạo column names legend bằng công cụ legend trên toolbar Chúng ta chọn một biến số sau đó giữ CTRL để chọn biến số thứ hai, thứ ba v.v

Màu của column names legend sẽ là màu mặc định của PBI Muốn thay đổi màu cho các legend chúng ta

sử dụng attribute pane của legend và chọn edit scale color

Formatting and Moving Legends

Tất cả các legend sẽ được hiển thị trong layer pane ở mục Chart Chúng ta chỉ cần click chọn legend đó và cửa sổ attribute của legend sẽ hiển thị để chúng ta lựa chọn thay đổi các attribute của legend

Trong hình trên chúng ta đã thay đổi legend của biến phân loại saleperson đưa legend lên trên và chọn shape của nó là hình vuông

Đối với legend của biến số chúng ta đã thay đổi màu của tick và chuyển tick line thành màu đỏ Front size của tick cũng thay đổi

Editing the Scale of a Numerical Legend

Đối với numercial legend ngoài range chúng ta còn có thể thay đổi domain của numerical legend Domain chính là giá trị bắt đầu và giá trị kết thúc của legend trên trục x hoặc trục y

Trong hình trên chúng ta chọn legend numerical trên trục y và thay đổi start của domain từ 0 thành 200000 Khi đó legend y thay đổi thành 200000 thành 800000

Như đã nói ở trên chúng ta cũng có thể thay đổi range của numerical legend

Trong hình trên đáng lẽ mặc định giá trị end của range là 300 nghĩa là chỉ mở rộng khung vẽ đến 800000

là giá trị của recgtangle dài nhất Nhưng nếu chúng ta nhập giá trị End là 400 thì khoảng giá trị của legend

sẽ kéo dãn đến 900.000 khi đó chúng ta sẽ thấy các rectangle sẽ bị thu nhỏ lại và khung vẽ sẽ kéo dài ra