IT TIP

d3.scale.category10 ()에 해당하는 d3.js v4.0은 무엇입니까?

itqueen 2020. 10. 29. 20:16
반응형

d3.scale.category10 ()에 해당하는 d3.js v4.0은 무엇입니까?


Interactive Web Visualization 책으로 d3를 배우려고하는데 4.0 버전에서는 많은 변화가있었습니다. 내가 정말로 알아낼 수없는 한 가지는 d3.scale.category10 ()에 상응하는 것이 있는지 여부입니다. 새 버전에 이와 비슷한 것이 있습니까? 아니면 math.random을 사용하고 직접 코드를 작성해야합니까?


대신에

d3.scale.category10()

사용하다

d3.scaleOrdinal(d3.schemeCategory10);

다음과 같은 색상 스케일을 만듭니다.

var color = d3.scaleOrdinal(d3.schemeCategory10);

V3에서와 같은 코드에서 다음과 같은 색상을 사용하십시오.

svg.append("rect")
.attr("x", 10)
.attr("y", 10)
.attr("width", 100)
.attr("height", 100)
.style("fill", color(3))

여기에서 읽으 십시오

여기에서 참조

여기에 작업 코드


간단한 해결책은 d3.js 버전 -4에서 다음과 같은 색상 스케일을 사용하는 것입니다.

var colorScale_1 = d3.schemeCategory10;
var colorScale_2 = schemeCategory20;
var colorScale_3 = d3.schemeCategory20b;
var colorScale_4 = d3.schemeCategory20c;

colorScale_1, colorScale_2, colorScale_3, colorScale_4는 서로 다른 색상의 배열입니다. 따라서 서로 다른 인덱스를 사용하여 모양을 채울 수 있습니다. 예를 들면

svg.append("rect")
.attr("x", 10)
.attr("y", 10)
.attr("width", 100)
.attr("height", 100)
.style("fill", colorScale_1[2])

참고로 여기를보십시오 : http://bl.ocks.org/emmasaunders/f4902478bcfa411c77a412c02087bed4

도움이되기를 바랍니다.

참고 URL : https://stackoverflow.com/questions/38391411/what-is-the-d3-js-v4-0-equivalent-for-d3-scale-category10

반응형