HTML5 Chart.js 框架

其他 2020-03-02 10:14:01 阅读次数: 0

HTML5 Chart.js 框架

Chart.js 概述：

chart.js 是一个简单的、面向对象、为设计者开发者准备的图表绘制工具。

点击进入官方网址

 　　　　

chart.js 的特点

基于 HTML5 

　　chart.js 基于 HTML5 canvas 技术，支持所有主流浏览器。

　　针对 IE7/IE8 提供了降级解决方案。

简单灵活

　　chart.js 不依赖任何外部工具库，轻量级（压缩后仅仅4.5K）。

　　提供了加载外部参数的方法。

chart.js 的功能

chart.js 可以用不同的方式让数据变得可视化。

每种类型的图标都有动画效果。

图标的类型：

　　- 柱状图　　- 曲线图　　- 雷达图　　- 饼状图　　- 极地区域图　　- 环形图

chart.js 基础

　　

　　这个网址，引入 chart 文件。

　　

　　

　　

　　　　

　　

　　OK，以后就可以在本地使用 chart.js 文件了，不需要再导入网址，没网也可以用了。

　　

  简单基础案例代码

<!-- 导入之前讲解保存好的 js 文件 -->
<script src="mychat.js"></script> 

<p style="border: 1px solid #999999; width:600px ;height:450px">

  <canvas id="canvas" width="600" height="450"></canvas>

</p>

<script type="text/javascript">
  var ctx = document.getElementById("canvas").getContext("2d");
  // 创建一个Chart对象
  var mychart = new Chart(ctx,{
    type:"bar",  // 柱状图
    data:{   // 数据：json集合
      labels:["A","B","C"],  // 横坐标轴
      datasets:[   // 各个列数据 ： json
        {
          data:[11,15,8]  
        }
      ]
    },
    options:{
      scales:{
        yAxes:[
          {
            ticks:{
              beginAtZero:true  
            }
          }
        ]
      }
    }
  })

</script>
 
 
 查看官方文档
 
 
 
 
就进入了 chart.js 的官方文档，但是比较慢，哈哈，等吧，但是还有一个问题，就是他这个文档是英文的。对 ！ English！
 
  
 
 
  
 
官网文档基础案例
 
 
<canvas id="myChart" width="400" height="400"></canvas>
<script>
var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
    type: 'bar',
    data: {
        labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
        datasets: [{
            label: '# of Votes',
            data: [12, 19, 3, 5, 2, 3],
            backgroundColor: [
                'rgba(255, 99, 132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)',
                'rgba(153, 102, 255, 0.2)',
                'rgba(255, 159, 64, 0.2)'
            ],
            borderColor: [
                'rgba(255,99,132,1)',
                'rgba(54, 162, 235, 1)',
                'rgba(255, 206, 86, 1)',
                'rgba(75, 192, 192, 1)',
                'rgba(153, 102, 255, 1)',
                'rgba(255, 159, 64, 1)'
            ],
            borderWidth: 1
        }]
    },
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero:true
                }
            }]
        }
    }
});
</script>
 
 
 chart.js 基础案例
 
 
<!-- 导入之前讲解保存好的 js 文件 -->
<script src="mychat.js"></script>

<p style="border: 1px solid #999999; width:600px ;height:450px">

  <canvas id="canvas" width="600" height="450"></canvas>

</p>

<script type="text/javascript">
  var ctx = document.getElementById("canvas").getContext("2d");
  // 创建一个Chart对象
  var mychart = new Chart(ctx,{
    type:"bar",  // 柱状图
    data:{   // 数据：json集合
      labels:["A","B","C"],  // 帮助我们创出X轴坐标点内容
      datasets:[  // 一个统计图表可以有多个图表
        {
          label:"hhh",   // 标题
          data:[11,15,8],  // X轴各坐标点的数值
          backgroundColor: [  //  条形图 颜色
               'rgba(255, 99, 132, 0.2)',
               'rgba(54, 162, 235, 0.2)',
               'rgba(255, 206, 86, 0.2)'
           ],
           borderColor: [  // 条形图 边框颜色
               'rgba(255,99,132,1)',
               'rgba(54, 162, 235, 1)',
               'rgba(255, 206, 86, 1)'
           ],
           borderWidth: 3 // 边框宽度
        },
        {
          label:"hhh",   // 标题
          data:[11,15,8],  // X轴各坐标点的数值
          backgroundColor: [  //  条形图 颜色
               'rgba(255, 99, 132, 0.2)',
               'rgba(54, 162, 235, 0.2)',
               'rgba(255, 206, 86, 0.2)'
           ],
           borderColor: [  // 条形图 边框颜色
               'rgba(255,99,132,1)',
               'rgba(54, 162, 235, 1)',
               'rgba(255, 206, 86, 1)'
           ],
           borderWidth: 3 // 边框宽度
        }
      ]
    },
    options:{
      scales:{  // 刻度 - Y轴刻度
        yAxes:[
          {
            ticks:{
              beginAtZero:true  // 刻度从 0 开始。
            }
          }
        ]
      },
      layout:{
        padding:{  // 设置内边距
          left:50,
          right:0,
          top:0,
          bottom:0
        }
      },
      legend:{  // 设置标题的颜色
        display:true,
        labels:{
          fontColor :"rgb(255,99,132)"
        }
      },
      title:{  // 设置标题
        display:true,
        text:"这是个标题"
      }
    }
  });

</script>
 
 
 
 
chart.js 的使用
 
 
 chart.js 曲线图 line
 
 
 　　
 
 
代码案例
 
 
<style>
  .chart-container{
    position: relative;
    border: 1px solid #999999;
    margin: auto;
    width: 80vw;
    height: 80vh;
    text-align: center;
  }
</style>

 <script src="mychat.js"></script>

<p class="chart-container">
  <select id="type" class="" name="type">
    <option value="line">曲线图</option>
  </select>
  <button type="button" onclick="changetype()" >生成图表</button>
  <canvas id="myChart"></canvas>
</p>

<script type="text/javascript">
  var ctx = document.getElementById("myChart").getContext("2d");
  var  t = document.getElementById('type').value;
  var d={
    // X 轴显示的文本
    labels:["Sun","Mon","Tue","Wed","Thr","Fri","Sat"],
    datasets:[
      {
        label:"大蜥蜴",
        // 数据集
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        // 边框宽度
        borderWidth:1,
        backgroundColor:[
          'rgba(132,99,244,0.2)',
          'rgba(235,33,244,0.2)',
          'rgba(132,145,158,0.2)',
          'rgba(111,99,54,0.2)',
          'rgba(132,99,144,0.2)',
          'rgba(145,32,25,0.2)',
          'rgba(58,125,222,0.2)'
        ],
        borderColor:[
          'rgba(132,99,244,1)',
          'rgba(235,33,244,1)',
          'rgba(132,145,158,1)',
          'rgba(111,99,54,1)',
          'rgba(132,99,144,1)',
          'rgba(145,32,25,1)',
          'rgba(58,125,222,1)'
        ]
      },
      {
        label:"猪猪侠",
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        borderWidth:1
      }
    ]
  };
  var o ={
    maintainAspectRation:false, // 自动适配，自动根据父容器调整大小。
    scales:{  // 刻度
      yAxes:[
        {
          // ticks:{beginAtZero:true} // 刻度从零开始。
          gridLines:{
            display:false
          }  // 显示竖线。
        }
      ],
      xAxes:[
        {
          gridLines:{
            display:false
          }
        }
      ]
    }

  };
  function changetype() {
    t = document.getElementById('type').value;
    new Chart( ctx , { type: t , data: d , options: o } );
  }

</script>
 
 
 
 
chart.js 柱状图 bar
 
 
 　　
 
 
案例代码
 
 
<style>
  .chart-container{
    position: relative;
    border: 1px solid #999999;
    margin: auto;
    width: 80vw;
    height: 80vh;
    text-align: center;
  }
</style>

 <script src="mychat.js"></script>

<p class="chart-container">
  <select id="type" class="" name="type">
    <option value="line">曲线图</option>
    <option value="bar">柱状图</option>
  </select>
  <button type="button" onclick="changetype()" >生成图表</button>
  <canvas id="myChart"></canvas>
</p>

<script type="text/javascript">
  var ctx = document.getElementById("myChart").getContext("2d");
  var  t = document.getElementById('type').value;
  var d={
    // X 轴显示的文本
    labels:["Sun","Mon","Tue","Wed","Thr","Fri","Sat"],
    datasets:[
      {
        label:"大蜥蜴",
        // 数据集
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        // 边框宽度
        borderWidth:1,
        backgroundColor:[
          'rgba(132,99,244,0.2)',
          'rgba(235,33,244,0.2)',
          'rgba(132,145,158,0.2)',
          'rgba(111,99,54,0.2)',
          'rgba(132,99,144,0.2)',
          'rgba(145,32,25,0.2)',
          'rgba(58,125,222,0.2)'
        ],
        borderColor:[
          'rgba(132,99,244,1)',
          'rgba(235,33,244,1)',
          'rgba(132,145,158,1)',
          'rgba(111,99,54,1)',
          'rgba(132,99,144,1)',
          'rgba(145,32,25,1)',
          'rgba(58,125,222,1)'
        ]
      },
      {
        label:"猪猪侠",
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        borderWidth:1
      }
    ]
  };
  var o ={
    maintainAspectRation:false, // 自动适配，自动根据父容器调整大小。
    scales:{  // 刻度
      yAxes:[
        {
          // ticks:{beginAtZero:true} // 刻度从零开始。
          gridLines:{
            display:false
          }  // 显示竖线。
        }
      ],
      xAxes:[
        {
          gridLines:{
            display:false
          }
        }
      ]
    }

  };
  function changetype() {
    t = document.getElementById('type').value;
    new Chart( ctx , { type: t , data: d , options: o } );
  }

</script>
 
 
 
 
 chart.js 饼状图 pie
 
 
 　　
 
 
案例代码
 
 
<style>
  .chart-container{
    position: relative;
    border: 1px solid #999999;
    margin: auto;
    width: 80vw;
    height: 80vh;
    text-align: center;
  }
</style>

 <script src="mychat.js"></script>

<p class="chart-container">
  <select id="type" class="" name="type">
    <option value="line">曲线图</option>
    <option value="bar">柱状图</option>
    <option value="pie">饼图</option>
  </select>
  <button type="button" onclick="changetype()" >生成图表</button>
  <canvas id="myChart"></canvas>
</p>

<script type="text/javascript">
  var ctx = document.getElementById("myChart").getContext("2d");
  var  t = document.getElementById('type').value;
  var d={
    // X 轴显示的文本
    labels:["Sun","Mon","Tue","Wed","Thr","Fri","Sat"],
    datasets:[
      {
        label:"大蜥蜴",
        // 数据集
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        // 边框宽度
        borderWidth:1,
        backgroundColor:[
          'rgba(132,99,244,0.2)',
          'rgba(235,33,244,0.2)',
          'rgba(132,145,158,0.2)',
          'rgba(111,99,54,0.2)',
          'rgba(132,99,144,0.2)',
          'rgba(145,32,25,0.2)',
          'rgba(58,125,222,0.2)'
        ],
        borderColor:[
          'rgba(132,99,244,1)',
          'rgba(235,33,244,1)',
          'rgba(132,145,158,1)',
          'rgba(111,99,54,1)',
          'rgba(132,99,144,1)',
          'rgba(145,32,25,1)',
          'rgba(58,125,222,1)'
        ]
      },
      {
        label:"猪猪侠",
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        borderWidth:1
      }
    ]
  };
  var o ={
    maintainAspectRation:false, // 自动适配，自动根据父容器调整大小。
    scales:{  // 刻度
      yAxes:[
        {
          // ticks:{beginAtZero:true} // 刻度从零开始。
          gridLines:{
            display:false
          }  // 显示竖线。
        }
      ],
      xAxes:[
        {
          gridLines:{
            display:false
          }
        }
      ]
    }

  };
  function changetype() {
    t = document.getElementById('type').value;
    new Chart( ctx , { type: t , data: d , options: o } );
  }

</script>
 
 
　　
 
 
 chart.js 雷达图 radar
 
 
 　　
 
 
案例代码
 
 
<style>
  .chart-container{
    position: relative;
    border: 1px solid #999999;
    margin: auto;
    width: 80vw;
    height: 80vh;
    text-align: center;
  }
</style>

 <script src="mychat.js"></script>

<p class="chart-container">
  <select id="type" class="" name="type">
    <option value="line">曲线图</option>
    <option value="bar">柱状图</option>
    <option value="pie">饼图</option>
    <option value="radar">雷达图</option>
  </select>
  <button type="button" onclick="changetype()" >生成图表</button>
  <canvas id="myChart"></canvas>
</p>

<script type="text/javascript">
  var ctx = document.getElementById("myChart").getContext("2d");
  var  t = document.getElementById('type').value;
  var d={
    // X 轴显示的文本
    labels:["Sun","Mon","Tue","Wed","Thr","Fri","Sat"],
    datasets:[
      {
        label:"大蜥蜴",
        // 数据集
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        // 边框宽度
        borderWidth:1,
        backgroundColor:[
          'rgba(132,99,244,0.2)',
          'rgba(235,33,244,0.2)',
          'rgba(132,145,158,0.2)',
          'rgba(111,99,54,0.2)',
          'rgba(132,99,144,0.2)',
          'rgba(145,32,25,0.2)',
          'rgba(58,125,222,0.2)'
        ],
        borderColor:[
          'rgba(132,99,244,1)',
          'rgba(235,33,244,1)',
          'rgba(132,145,158,1)',
          'rgba(111,99,54,1)',
          'rgba(132,99,144,1)',
          'rgba(145,32,25,1)',
          'rgba(58,125,222,1)'
        ]
      },
      {
        label:"猪猪侠",
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        borderWidth:1
      }
    ]
  };
  var o ={
    maintainAspectRation:false, // 自动适配，自动根据父容器调整大小。
    scales:{  // 刻度
      yAxes:[
        {
          // ticks:{beginAtZero:true} // 刻度从零开始。
          gridLines:{
            display:false
          }  // 显示竖线。
        }
      ],
      xAxes:[
        {
          gridLines:{
            display:false
          }
        }
      ]
    }

  };
  function changetype() {
    t = document.getElementById('type').value;
    new Chart( ctx , { type: t , data: d , options: o } );
  }

</script>
 
 
　　
 
 
chart.js 极地区域图 polarArea
 
 
 　　
 
 
案例代码
 
 
<style>
  .chart-container{
    position: relative;
    border: 1px solid #999999;
    margin: auto;
    width: 80vw;
    height: 80vh;
    text-align: center;
  }
</style>

 <script src="mychat.js"></script>

<p class="chart-container">
  <select id="type" class="" name="type">
    <option value="line">曲线图</option>
    <option value="bar">柱状图</option>
    <option value="pie">饼图</option>
    <option value="radar">雷达图</option>
    <option value="polarArea">极地区域图</option>
  </select>
  <button type="button" onclick="changetype()" >生成图表</button>
  <canvas id="myChart"></canvas>
</p>

<script type="text/javascript">
  var ctx = document.getElementById("myChart").getContext("2d");
  var  t = document.getElementById('type').value;
  var d={
    // X 轴显示的文本
    labels:["Sun","Mon","Tue","Wed","Thr","Fri","Sat"],
    datasets:[
      {
        label:"大蜥蜴",
        // 数据集
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        // 边框宽度
        borderWidth:1,
        backgroundColor:[
          'rgba(132,99,244,0.2)',
          'rgba(235,33,244,0.2)',
          'rgba(132,145,158,0.2)',
          'rgba(111,99,54,0.2)',
          'rgba(132,99,144,0.2)',
          'rgba(145,32,25,0.2)',
          'rgba(58,125,222,0.2)'
        ],
        borderColor:[
          'rgba(132,99,244,1)',
          'rgba(235,33,244,1)',
          'rgba(132,145,158,1)',
          'rgba(111,99,54,1)',
          'rgba(132,99,144,1)',
          'rgba(145,32,25,1)',
          'rgba(58,125,222,1)'
        ]
      },
      {
        label:"猪猪侠",
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        borderWidth:1
      }
    ]
  };
  var o ={
    maintainAspectRation:false, // 自动适配，自动根据父容器调整大小。
    scales:{  // 刻度
      yAxes:[
        {
          // ticks:{beginAtZero:true} // 刻度从零开始。
          gridLines:{
            display:false
          }  // 显示竖线。
        }
      ],
      xAxes:[
        {
          gridLines:{
            display:false
          }
        }
      ]
    }

  };
  function changetype() {
    t = document.getElementById('type').value;
    new Chart( ctx , { type: t , data: d , options: o } );
  }

</script>
 
 
　　
 
 
chart.js 环形图 doughnut
 
 
 　　
 
 
案例代码
 
 
<style>
  .chart-container{
    position: relative;
    border: 1px solid #999999;
    margin: auto;
    width: 80vw;
    height: 80vh;
    text-align: center;
  }
</style>

 <script src="mychat.js"></script>

<p class="chart-container">
  <select id="type" class="" name="type">
    <option value="line">曲线图</option>
    <option value="bar">柱状图</option>
    <option value="pie">饼图</option>
    <option value="radar">雷达图</option>
    <option value="polarArea">极地区域图</option>
    <option value="doughnut">环形图</option>
  </select>
  <button type="button" onclick="changetype()" >生成图表</button>
  <canvas id="myChart"></canvas>
</p>

<script type="text/javascript">
  var ctx = document.getElementById("myChart").getContext("2d");
  var  t = document.getElementById('type').value;
  var d={
    // X 轴显示的文本
    labels:["Sun","Mon","Tue","Wed","Thr","Fri","Sat"],
    datasets:[
      {
        label:"大蜥蜴",
        // 数据集
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        // 边框宽度
        borderWidth:1,
        backgroundColor:[
          'rgba(132,99,244,0.2)',
          'rgba(235,33,244,0.2)',
          'rgba(132,145,158,0.2)',
          'rgba(111,99,54,0.2)',
          'rgba(132,99,144,0.2)',
          'rgba(145,32,25,0.2)',
          'rgba(58,125,222,0.2)'
        ],
        borderColor:[
          'rgba(132,99,244,1)',
          'rgba(235,33,244,1)',
          'rgba(132,145,158,1)',
          'rgba(111,99,54,1)',
          'rgba(132,99,144,1)',
          'rgba(145,32,25,1)',
          'rgba(58,125,222,1)'
        ]
      },
      {
        label:"猪猪侠",
        data:[parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100),parseInt(Math.random()*100)],
        borderWidth:1
      }
    ]
  };
  var o ={
    maintainAspectRation:false, // 自动适配，自动根据父容器调整大小。
    scales:{  // 刻度
      yAxes:[
        {
          // ticks:{beginAtZero:true} // 刻度从零开始。
          gridLines:{
            display:false
          }  // 显示竖线。
        }
      ],
      xAxes:[
        {
          gridLines:{
            display:false
          }
        }
      ]
    }

  };
  function changetype() {
    t = document.getElementById('type').value;
    new Chart( ctx , { type: t , data: d , options: o } );
  }

</script>
 
 
　　
 
 
结束，谢谢！
 

 

 
 
 
   
 
 

 

 
 
 
      
 
 
 
 
  
 
   JayveeWong 
  
 
  
 
   发布了118 篇原创文章 · 
   获赞 123 · 
   访问量 6万+ 
  
 
 
 
 
 
  私信  
  关注 
 
 


                    
                    
                    
                    
                    
                    
                    
                    
                    

                        
猜你喜欢

                        

                            
                            
                        

                    


                    
转载自blog.csdn.net/weixin_42776111/article/details/104431256

                    

                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                        
                    

                    


                

            

            


                

                    

                        
                        
                        
                        
                    


                    

                        

                            

                                今日推荐
                            


                            

                        

                    

                    

                        

                            

                                TIOBE 5 月榜单：Fortran “复活”进入 Top 10
                            

                        

                        

                            

                                GCC 14.1 发布
                            

                        

                        

                            

                                面壁智能发布 Eurux-8x22B 开源大模型 —— 堪称「理科状元」
                            

                        

                        

                            

                                开源日报 | 谷歌扶持鸿蒙上位；开源Rabbit R1；Docker加持的安卓手机；微软的焦虑和野心；海尔电器把开放平台关了
                            

                        

                        

                            

                                中国码农的“35岁魔咒”
                            

                        

                        

                            

                                蘭雅 CorelDRAW 插件 2024.5.1 国际劳动节版，免费下载
                            

                        

                        

                            

                                Arc Browser for Windows 1.0 正式 GA
                            

                        

                        

                            

                                90后程序员开发视频搬运软件、不到一年获利超 700 万，结局很刑！
                            

                        

                        
                        
                    

                


                

                    

                        

                            

                                周排行
                            

                            

                        

                    

                    

                        

                            

                                Java自定义时间格式
                            

                        

                        

                            

                                同步整形电路
                            

                        

                        

                            

                                在开发中最最最常用的字符串的属性大集合
                            

                        

                        

                            

                                Linux 查看端口占用并杀掉
                            

                        

                        

                            

                                Java基础四：ArrayList
                            

                        

                        

                            

                                多线程之死锁就是这么简单
                            

                        

                        

                            

                                mysql 基础命令集
                            

                        

                        

                            

                                awk 命令详解
                            

                        

                        

                            

                                Centos6.3编译安装nginx+php步骤
                            

                        

                        

                            

                                OCR （Optical Character Recognition，光学字符识别）
                            

                        

                    

                

                

                    

                        

                            

                                每日归档
                            

                            

                                更多
                            

                            

                        

                    

                    

                        

                            2024-05-08(42)
                        

                        

                            2024-05-07(14)
                        

                        

                            2024-05-06(40)
                        

                        

                            2024-05-05(0)
                        

                        

                            2024-05-04(7)
                        

                        

                            2024-05-03(19)
                        

                        

                            2024-05-02(0)
                        

                        

                            2024-05-01(4)
                        

                        

                            2024-04-30(1)
                        

                        

                            2024-04-29(40)
                        

                    

                


            


            
        

    






















    


        

            
代码天地 © 2018 codetd.com

            境外服务器
             
            最新电视剧2022