La función d3.scaleBand() en D3.js se usa para construir una nueva escala de banda con el dominio especificado como una array de valores y el rango como las extensiones mínima y máxima de las bandas. Esta función divide el rango en n bandas donde n es el número de valores en la array de dominio.
Sintaxis:
d3.scaleBand().domain(array of values).range(array of values);
Parámetros: Esta función no acepta ningún parámetro.
Valor devuelto: esta función devuelve el rango correspondiente para el valor del dominio.
Los siguientes programas ilustran la función d3.scaleBand() en D3.js:
Ejemplo 1:
<!DOCTYPE html>
<html>
<head>
<title>
D3.js | d3.scaleBand() Function
</title>
<script src =
"https://d3js.org/d3.v4.min.js">
</script>
</head>
<body>
<script>
// Calling the scaleBand() function
var A = d3.scaleBand()
.domain(['January', 'February', 'March', 'April', 'May'])
.range([10, 50]);
// Getting the corresponding range for
// the domain value
console.log(A('January'));
console.log(A('February'));
console.log(A('March'));
console.log(A('April'));
console.log(A('May'));
</script>
</body>
</html>
Producción:
10 18 26 34 42
Ejemplo 2:
<!DOCTYPE html>
<html>
<head>
<title>
D3.js | d3.scaleBand() Function
</title>
<script src =
"https://d3js.org/d3.v4.min.js">
</script>
</head>
<body>
<script>
// Calling the scaleBand() function
var A = d3.scaleBand()
.domain(['January', 'February', 'March', 'April', 'May'])
.range([1, 2]);
// Getting the corresponding range for
// the domain value
console.log(A('January'));
console.log(A('February'));
console.log(A('March'));
console.log(A('April'));
console.log(A('May'));
</script>
</body>
</html>
Producción:
1 1.2 1.4 1.6 1.8
Referencia: https://devdocs.io/d3~5/d3-scale#scaleBand
Publicación traducida automáticamente
Artículo escrito por Kanchan_Ray y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA