Tengo los siguientes datos JSON que necesito pasar a mi función D3 para llenar los colores de algunos bloques en un SVG:

 { "_116": { "scanned": 234, "sold": 295 }, "_119": { "scanned": 175, "sold": 207 }, "_210": { "scanned": 133, "sold": 235 }, "_118": { "scanned": 136, "sold": 189 }, "_123": { "scanned": 63, "sold": 160 }, "_106": { "scanned": 38, "sold": 66 }, "_108": { "scanned": 184, "sold": 242 }, }

Las claves en estos datos se corresponden con la identificación de la ruta en mi SVG renderizado como tal:

 <path id="_116" serif:id="116" d="M75,22c0,-1.105 0.895,-2 2,-2l31,0c1.105,0 2,0.895 2,2l0,25c0,1.105 -0.895,2 -2,2l-31,0c-1.105,0 -2,-0.895 -2,-2l0,-25Z" style="fill:#fff;fill-rule:nonzero;"/>

Quiero usar D3 para agregar el relleno de estilo de todos estos elementos de ruta en función de los datos pasados en una escala lineal.

Esto es lo que tengo hasta ahora:

 let color = d3.scaleLinear() .domain([1,100]) .range(["white", "green"]); d3.select("path#_116") .style('fill',function(d,i) { return color(10); });

Esto solo llenaría el valor de un elemento de path único con id _116 con el valor de 10 con la escala lineal de 1 - 100.

¿Cómo haría que esto funcionara para mapear todos mis elementos de path con los datos en mi JSON en función de las claves y para que use el rango de dominio de [0 - sold ] y el valor del relleno como el atributo scanned en ¿mis datos?