I can’t get the transform translate to work in the example below. All the petals are in the same place. It doesn’t look as if the code inside the single quotes is being recognised.
It’s part of Shirley Wu’s (@sxywu )Intro to D3 and I’ve coded it as per Shirley’s example which appears to work.
The full code is here
and the specific code snippet here.
{
const svg = html<svg width=${width} height=${svgHeight}></svg>
// YOUR CODE HERE
d3.select(svg)
.selectAll(‘path’)
.data(movies)
.enter().append(‘path’)
.attr(‘transform’, (d,i) => ‘translate(${calculateGridPos(i)})’)
.attr(‘d’, d => pathObj[d.rated])
.attr(‘fill’, d=> colorObj[d.genres[0]] || colorObj.Other)
.attr(‘stroke’, d=> colorObj[d.genres[0]] || colorObj.Other)
.attr(‘fill-opacity’, 0.1)
.attr(‘stroke-width’, 4)
return scrollSVG(svg)
}