Javascript 当我按下链接按钮时，在同一个div上更新google可视化

我正在使用谷歌可视化为犯罪数据创建一个仪表板。 我有四个链接，当它们被按下时，应该每周、每月、每季度和每年更新数据。现在我有一个显示每周数据的图表，但我想在按下“quarter”链接时更新同一个div中的图表（这里是classdiv1）。我对图表进行了编码，但我不知道如何更新它们并将它们映射到我的链接。任何想法都将不胜感激。我在下面附上我的部分代码。谢谢

<div class="classdiv-1">
    <div class="classmenu1">
        <a href="#"><center>Weekly</center></a>
    </div>
    <br>
    <div class="classmenu2">
        <a href="#"><center>Monthly</center></a>
    </div>
    <br>
    <div class="classmenu3">
        <a href="#"><center>Quarter</center></a>
    </div>
    <br>
    <div class="classmenu4">
        <a href="#"><center>Annually</center></a>
    </div>
</div>

function drawChartW() {
    var data = google.visualization.arrayToDataTable([
        ['Year', 'Crime', 'Incidence', 'Stock Loss'],
        ['1',  50, 34, 55],
        ['2',  117, 46, 21],
        ['3',  66,  54, 42],
        ['4',  67, 59, 52]
    ]);

    var options = {
      title: 'Thread Trends'
    };

    var chart = new google.visualization.LineChart(document.getElementById('classdiv1'));
    chart.draw(data, options);
} 

函数drawChartW（）{
var data=google.visualization.arrayToDataTable([
[‘年份’、‘犯罪’、‘发生率’、‘库存损失’]，
['1',  50, 34, 55],
['2',  117, 46, 21],
['3',  66,  54, 42],
['4',  67, 59, 52]
]);
变量选项={
标题：“线程趋势”
};
var chart=new google.visualization.LineChart（document.getElementById（'classdiv1'）；
图表绘制（数据、选项）；
} 

---

其他3个图形的类型相同，它们分别命名为drawChartM（）、drawChartQ（）和drawChartA（）。

您不必有四种不同的

drawChart

-方法。考虑这一点：

每个时段都有不同的数组（请参阅下面fiddle中的测试数组）

功能图（句点）{
var数据；
转换（周期）{
案例“m”：
数据=每月；中断；
案例‘q’：
数据=季度；中断；
案例“a”：
数据=年度；中断；
违约：
数据=每周；中断；
};      
var dataSet=google.visualization.arrayToDataTable（数据）；
var选项={}；
var chart=new google.visualization.LineChart（document.getElementById（'chart'）；
绘制图表（数据集、选项）；
}

onload

weekly将被解除显示，默认值为

google.setOnLoadCallback(drawChart);

工作小提琴->
你真的这样给你的班级命名吗<代码>：S

我目前正在使用一些虚拟数据，因此我不强调代码质量和维护：）