<button id="btn1">Sobreviventes e mortos por grupos</button>
<button id="btn2">Sobreviventes e mortos por porta de embarque</button>
<button id="btn3">Foto</button>


<div id="chartContainer">

<script type="text/javascript">

// novo gráfio bubble incluso

    var svg = dimple.newSvg("#chartContainer", 590, 400);
    d3.csv("d3_1.csv", function (data) {
        var myChart = new dimple.chart(svg, data);
        myChart.setBounds(65, 30, 505, 330)
        myChart.addCategoryAxis("x", ["Embarked", "Survived"]);
        myChart.addMeasureAxis("y", "Amount");
        myChart.addMeasureAxis("z", "Amount");
        myChart.addSeries("Survived", dimple.plot.bubble);
        myChart.addLegend(70, 10, 510, 20, "right");
        myChart.draw();
    });
</script>

<script type="text/javascript">

    d3.select("#btn1").on("click", function(){
        d3.select("svg").remove();
        var svg = dimple.newSvg("#chartContainer", 590, 400);
        d3.csv("d3_1.csv", function (data) {
            var myChart = new dimple.chart(svg, data);
            myChart.setBounds(65, 30, 505, 330)
            myChart.addCategoryAxis("x", ["Embarked", "Survived"]);
            myChart.addMeasureAxis("y", "Amount");
            myChart.addMeasureAxis("z", "Amount");
            myChart.addSeries("Survived", dimple.plot.bubble);
            myChart.addLegend(70, 10, 510, 20, "right");
            myChart.draw();
        });
    });
</script>

<script type="text/javascript">

    d3.select("#btn2").on("click", function(){
        d3.select("svg").remove();
        var svg = dimple.newSvg("#chartContainer", 600, 400);
        d3.csv("d3_1.csv", function (data) {
            var myChart = new dimple.chart(svg, data);
            myChart.setBounds(80, 30, 480, 330)
            myChart.addMeasureAxis("x", "Amount");
            myChart.addCategoryAxis("y", ["Embarked", "Survived"]);
            myChart.addSeries("Survived", dimple.plot.bar);
            myChart.addLegend(60, 10, 510, 20, "right");
            myChart.draw();

        });
    });
</script>

<script>

    d3.select("#btn3").on("click", function(){
        // Fazer com que a OPÇÃO 1 ou 2 abaixo funcione com o botão acima exibindo a imagem
        do link: http://svgur.com/i/3Wh.svg


         });
    });
</script>

OPÇÃO 1
d3.xml("rect01.svg").mimeType("image/svg+xml").get(function(error, xml) {
  if (error) throw error;
  document.body.appendChild(xml.documentElement);
});

OPÇÃO 2

d3.xml("/assets/infographics/" + svgSource, "image/svg+xml", function(xml) {
 var importedNode = document.importNode(xml.documentElement, true);

    $('#svg-image')
    .find('g#' + id).append($(xml.documentElement).clone());
        container.attr("x" , "200px");
        container.attr("y", "200px");
 });

fonte: http://blog.optimal.io/how-to-add-a-svg-image-in-d3/