//=======================================================//
// Par Jeremy FOUQUAT                                    //
// Source : https://bl.ocks.org/mbostock/3808218         //
//=======================================================//
var width = 960,
    height = 500;

var svg = d3.select("svg")
    .attr("width", width)
    .attr("height", height);



// First solution ===================================
var first = svg.append("g")
    .attr('class', "first-image")
    .attr("transform", "translate(" + 75 + "," + 75 + ")")
    .append("path")
        .attr("d", d3.symbol().type(d3.symbolCross).size(10000));



// Second solution ==================================
var second = svg.append('svg:image')
    .attr("version", "1.1")
    .attr("xmlns", "http://www.w3.org/2000/svg")
    .attr("class", "dvf-table-embedded-chart")
    .attr("href", "fart.svg")
    .attr("width",150)
    .attr("height", 150)
    .attr("transform", "translate(" + 160 + "," + 0 + ")");


// Third solution ===================================
var test = null;
d3.xml("flame.svg", function(xml) {
    var importedNode = document.importNode(xml.documentElement, true);
    test = svg.append("svg")
        .attr('class', "third-image")
        .attr("width", 150)
        .attr("height",150)
        .attr("transform", "translate(" + 320 + "," + 0 + ")")
        .each(function() {
            this.appendChild(importedNode);
        })
    return test;
});
var third = svg.select(".third-image");
