天天看點

直播視訊網站源碼,使用Echarts實作餅圖

直播視訊網站源碼,使用Echarts實作餅圖相關的代碼

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>第一個 ECharts 執行個體</title>
    <!-- 引入 echarts.js -->
    <script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script>
</head>
<body>
    <!-- 為ECharts準備一個具備大小(寬高)的Dom -->
    <div id="main" style="width: 800px;height:600px;"></div>
    <script type="text/javascript">
        // 基于準備好的dom,初始化echarts執行個體
        var myChart = echarts.init(document.getElementById('main'));
 
        myChart.setOption({
            series : [
                {
                    name: '通路來源',
                    type: 'pie',    // 設定圖表類型為餅圖
                    radius: '55%',  // 餅圖的半徑,外半徑為可視區尺寸(容器高寬中較小一項)的 55% 長度。
                    data:[          // 資料數組,name 為資料項名稱,value 為資料項值
                        {value:235, name:'武漢市'},
                        {value:274, name:'襄陽市'},
                        {value:310, name:'鹹甯市'},
                        {value:335, name:'仙桃市'},
                        {value:400, name:'荊州市'}
                    ]
                }
            ]
        })
    </script>
</body>
</html>
           

以上就是直播視訊網站源碼,使用Echarts實作餅圖相關的代碼, 更多内容歡迎關注之後的文章

繼續閱讀