蚂蚁F2Chart折线图踩坑（串图，滑动跳闪）

近期公司需要做一个产品净值和收益率走势的曲线图功能，通过点击按钮可以展示近三月，近6月，近一年以及成立以来的走势图，其中遇到一个比较奇怪的问题：当手指在曲线上滑动查看净值、收益率时，会跳闪出现其他时段的曲线，后来分析原因是canvas每次画图，之前的数据没有清除干净，使用F2Chart自带的chart.clear()和chart.destory()都没有效果，于是在每次点击按钮画图前清除掉旧的canvas,代码如下：

//HTML部分
<div id="mychartParent">
    <canvas id="mychart" class="chart"></canvas>
<div>


//VUE的methods部分，每次点击按钮时先清除旧的canvas,再利用F2chart执行画图操作
draw(){
    let parent = document.getElementById('mychartParent')
    let dom = document.createElement('canvas');
    let mychart = document.getElementById('mychart')

    parent && parent.removeChild(document.getElementById('mychart'));
    dom.id = 'mychart'
    dom.className = 'chart'
    parent && parent.appendChild(dom);
    mychart && mychart.setAttribute('style',"width:100%;height:'250px'")

    //以下为F2Chart数据处理及画图部分，略过
    //...
    //..
    //.
}