D3.js
Trazos - Paths
Con trazados, se pueden dibujar formas abiertas y cerradas combinando líneas, curvas y arcos mediante un lenguaje de dibujo compacto en el atributo d del elemento <path>. Se puede usar para crear trazados arbitrarios combinando líneas rectas y curvas:
<path d="M100,200 C200,50 300,100 300,200 L400,250 500,100"
fill="yellow"
stroke="red"
stroke-width="4" />No te preocupes por todos esos números y letras en el atributo d. Es la parte más importante de la ruta, pero siempre puedes generarla automáticamente. La mayoría de los generadores de formas que usarás en D3 para crear líneas, sectores de gráfico circular y otras formas arbitrarias generan cadenas de ruta que puedes usar en el atributo d.
El simple <path> anterior representa la imagen a continuación (los puntos se agregan por separado y muestran los puntos de control):