0

I am working with this example: http://bl.ocks.org/mbostock/4206573

In every county, instead of a color, I want to use an image (and possibly have it repeat using css).

I tried adding an svg image to the document, and setting the path's fill attribute to url(<image_selector>) but to no effect. Essentially:

var image = svg.append("image")
  .attr("xlink:href", "http://lorempixel.com/g/400/400/")
  .attr("x", 0)
  .attr("y", 0)
  .attr("width", 400)
  .attr("height", 400)
  .attr("id", "fillImage");

And for a couple of path elements, I changed the fill attribute to url('#fillImage'). All this does is color the region bounded by the path white. Does anyone have any ideas?

Shriphani Palakodety
  • 169
  • 1
  • 4
  • @Oleg I just edited the attributes in my browser console. I'll probably just add a line or 2 in my post. – Shriphani Palakodety Apr 23 '16 at 00:42
  • @ShriphaniPalakodety I believe [this question](http://stackoverflow.com/questions/3796025/fill-svg-path-element-with-a-background-image) will help you achieve what you're looking for... – Greg Venech Apr 23 '16 at 13:32

0 Answers0