视频插件、图表插件（引用bootstrap）

最新推荐文章于 2023-07-04 18:54:45 发布

PythonYin

最新推荐文章于 2023-07-04 18:54:45 发布

阅读量1.7k

点赞数

分类专栏： web 文章标签： web前端

本文链接：https://blog.csdn.net/PythonYin/article/details/41947375

版权

web 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="/media/js/jquery-2.1.1.min.js" ></script>
    <script src="/media/js/Chart.js" ></script>
   <script src="/media/js/jquery.grumble.min.js"></script>
   <script style="text/css" src="/media/css/flat-ui.css"></script>
   <!-- Loading Bootstrap -->
    <link href="/media/dist/css/vendor/bootstrap.min.css" rel="stylesheet">

    <!-- Loading Flat UI -->
    <link href="/media/dist/css/flat-ui.css" rel="stylesheet">
    <link href="/media/docs/assets/css/demo.css" rel="stylesheet">

    <link rel="shortcut icon" href="img/favicon.ico">

    <script>
      $('#grumble1').grumble(
         {
            text: '',
            angle: 200,
            distance: 3,
            showAfter: 1000,
            hideAfter: 2000
         }
      );
      var listData = '{{ data | escapejs }}';
      var listDate = '{{ date | escapejs }}';
      console.log(listData);
      console.log(listDate);
      var randomScalingFactor = function(){ return Math.round(Math.random()*100)};
      var lineChartData = {
         labels : JSON.parse(listDate),
         datasets : [
            {
               label: "My First dataset",
               fillColor : "rgba(220,220,220,0.2)",
               strokeColor : "rgba(220,220,220,1)",
               pointColor : "rgba(220,220,220,1)",
               pointStrokeColor : "#fff",
               pointHighlightFill : "#fff",
               pointHighlightStroke : "rgba(220,220,220,1)",
               data :JSON.parse(listData)
            }
         ]
      }
   window.onload = function(){
      var ctx = document.getElementById("canvas").getContext("2d");
      window.myLine = new Chart(ctx).Line(lineChartData, {
         responsive: true
      });
   }
   </script>
</head>
<body>
  <div style="width:30%">
     <canvas id="canvas" height="450" width="600"></canvas>
  </div>

 <hr>
   <div style="width: 70%;border: 1px">
          <video class="video-js" preload="auto" poster="/media/images/poster.jpg" data-setup="{}">
            <source src="http://iurevych.github.com/Flat-UI-videos/big_buck_bunny.mp4" type="video/mp4">
            <source src="http://iurevych.github.com/Flat-UI-videos/big_buck_bunny.webm" type="video/webm">
          </video>
        </div>

   <div class="tagsinput-primary">
     <input name="tagsinput" class="tagsinput" data-role="tagsinput" value="School, Teacher, Colleague" />
</div>
    <script src="/media/dist/js/vendor/video.js"></script>    <script src="/media/dist/js/flat-ui.min.js"></script>    <script src="/media/docs/assets/js/application.js"></script>    <script>      videojs.options.flash.swf = "dist/js/vendors/video-js.swf"    </script></body></html>

PythonYin

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
视频插件、图表插件（引用bootstrap）

html>html>head lang="en"> meta charset="UTF-8"> title>title> script type="text/javascript" src="/media/js/jquery-2.1.1.min.js" >script> script src="/media/js/Chart.js" >script> sc
复制链接

扫一扫