Ios,echart.js rendering tree type, adding a canvas layer to the div layer causes the page to slide unsmoothly

style Code:

 * {margin: 0; padding: 0;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-overflow-scrolling: touch; overflow-scrolling: touch;}
 html,body{margin: 0;position: relative;}
 -sharpmain,-sharpmain>div{width:1000px;height:1000px;margin:0 auto !important;box-sizing: border-box;position: absolute !important;left:50% !important;top:50% !important;margin-left: -480px !important;margin-top: -480px !important;overflow: auto !important;}     
-sharpmain{overflow: scroll}

in ios phones, the sliding graphics area is not smooth. You need to wait for the page scroll bar to display.
use the echarts.js render tree plug-in results as shown in figure

div

change to a simple style, as follows:

* {margin: 0; padding: 0;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-overflow-scrolling: touch; overflow-scrolling: touch;}
        html,body{margin: 0;position: relative;}
        .none-data{width: 72px;height: 72px;position: absolute;left:50%;top:50%;margin-left: -36px;margin-top: -36px;display: none;}
        .bottom-txt{position: fixed;left: 0;bottom: 0;line-height:2.5;font-size:18px;color: -sharpccc;margin: 0;text-align: center;width: 100%;}
        -sharpmain{width:1000px;height:1000px;margin:0 auto;box-sizing: border-box;}
        -sharpmain.fullwidth{width:100%;height:100%;}
        canvas{-webkit-transform: translateZ(0); transform: translateZ(0);}