如何使用 D3.js 在带有按钮的一个区域中创建/显示具有相同数据的图表的多次迭代

我使用相同的数据创建了多个迭代。考虑此方案（使用相同的数据），三种不同的迭代是：

1） 饼图2） 条形图3） 折线图

现在，我希望能够在HTML模板的一个DIV中显示所有三个图表，但是用户应该能够通过选择选项1 2或3来选择他要查看的图表。

我已经在一个单独的 js 脚本中创建了我的 D3.js，并告诉它使用 "chart" 的 id 在 DIV 中创建图表。

(var svg = d3.select("#chart").append("svg")) /*line in app_d3.js that creates graph in div #chart*/

这是我的HTML模板（带有引导元素）：

<div id="chart"></div>
<form class="chart_form">
  <label><input type="radio" name="mode" value="size"> Mobile</label>
  <label><input type="radio" name="mode" value="count" checked> Email</label>
</form>
<div id="info_chart">
  <div class="btn-group">
    <button id="button_chart" type="button" class="btn btn-default">1</button>
    <button id="button_chart" type="button" class="btn btn-default">2</button>
    <button id="button_chart" type="button" class="btn btn-default">3</button>
  </div>
</div>

如何设置我的 d3.js 或 html 样式，以便在单击按钮 1 时仅显示饼图，依此类推，对于带按钮 2 的条形图和带按钮 3 的折线图？

谢谢（我无法共享我的数据，但 d3.js 脚本只是标准的饼图、条形图和折线图）