Cubism.js/d3.js Quy mô và mức độ

Question

Ai đó có thể cung cấp một số cái nhìn sâu sắc về cách quy mô và mức độ hợp tác với nhau trong cubism.js

.call(context.horizon() 
      .extent([-100, 100]) 
      .scale(d3.scale.linear().domain([-10,10]).range([-100,100]) 
        ) 
    ); 

Ví dụ những gì hiện các mã trên làm gì? Nếu các giá trị được tạo bằng trình tạo số ngẫu nhiên (các số từ -10 đến 10)

Tôi biết mức độ được sử dụng để đặt mức tối đa và tối thiểu.

tôi biết làm thế nào để xác định một quy mô, ví dụ:

var scale = d3.scale.threshold().domain([100]).range([0,100]) 
console.log(scale(1)) // returns 0 
console.log(scale(99.9)) // returns 0 
console.log(scale(88.9)) // returns 0 
console.log(scale(100)) // returns 100 

Tôi đọc về d3.scales đây http://alignedleft.com/tutorials/d3/scales/

Vấn đề chính của tôi là tôi muốn xác định ngưỡng cho dữ liệu của tôi, rất đơn giản 0-98 Red 98-100 hồng 100 màu xanh

Hoặc có thể chỉ 0-99,99 Red 100 màu xanh

Nhưng tôi không thể sử dụng tất cả những gì tôi đã đọc để xây dựng một cái gì đó hoạt động.

Answer 1

Tôi đoán rằng bạn chỉ muốn sử dụng một màu khác để biểu thị sự bất thường trong dữ liệu của bạn. Nếu điều đó đúng, bạn không cần tạo miền và dải ô.

Bạn chỉ có thể tạo ra một bảng màu tùy chỉnh như thế này:

bảng

var custom_colors = ['#ef3b2c', '#084594', '#2171b5', '#4292c6', '#6baed6', '#9ecae1', '#c6dbef', '#deebf7', '#f7fbff', '#f7fcf5', '#e5f5e0', '#c7e9c0', '#a1d99b', '#74c476', '#41ab5d', '#238b45', '#006d2c', '#00441b']; 

màu này được xây dựng bằng cách sử dụng bảng màu trên this page với một màu đỏ thêm tacked trên đến cùng.

Sau đó, chỉ cần gọi các màu sắc tùy chỉnh như thế này:

d3.select("#testdiv") 
    .selectAll(".horizon") 
    ... 
    .call(context.horizon() 
       .colors(custom_colors) 
)); 

Chơi xung quanh với các màu sắc cho đến khi bạn tìm thấy một sự kết hợp mà bạn thích. Trong ví dụ trên, chỉ có ngoại lệ sẽ có màu đỏ trong khi phần còn lại sẽ theo mẫu màu xanh dương và xanh lục.

Hy vọng điều này sẽ hữu ích!