d3图像具有更高的分辨率

Question

我成功用图像填充矩形。但是，分辨率非常低。

我想知道我能做些什么来提高我的图像分辨率？

我不知道这是否是尺寸问题，因为即使我增加了矩形的大小，分辨率仍然很差。

我的源代码：

function initRectElements(svg, data) {
    imgUrl = "image/star/5.png";
    d3.select(svg).append("defs")
            .append("pattern")
            .attr("id", "rating")
            .attr("width", rectwidth)
            .attr("height", rectheight)
            .append("image")
            .attr("xlink:href", imgUrl)

    var sel = d3.select(svg)
            .selectAll('rect.token')
            .data(data);

    sel.enter().append('rect')
            .classed('token', true);

    sel.exit().remove();

    d3.select(svg).selectAll('rect.token')
            .attr('x', function (d){return d
                    .x})
            .attr('y', function (d){return d
                    .y})
            .attr("width", rectwidth)
            .attr("height", rectheight)
            .attr('fill', "url(#rating)")
}

输出是这样的：