API tools faq
paste
Advertisement
maful

grafik

maful
May 15th, 2015
287
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 6.11 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="utf-8">
  5.     <title>Dashboard</title>
  6.     <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
  9.     <link rel="stylesheet" type="text/css" href="http://localhost/db_retribusi/assets/lib/bootstrap/css/bootstrap.css">
  10.     <link rel="stylesheet" href="http://localhost/db_retribusi/assets/lib/font-awesome/css/font-awesome.css">
  11.     <script src="http://localhost/db_retribusi/assets/lib/jquery-1.11.1.min.js" type="text/javascript"></script>
  12.     <script src="http://localhost/db_retribusi/assets/lib/jQuery-Knob/js/jquery.knob.js" type="text/javascript"></script>
  13.     <script src="http://localhost/db_retribusi/assets/lib/datepicker/zebra_datepicker.js"></script>
  14.     <link rel="stylesheet" href="http://localhost/db_retribusi/assets/lib/datepicker/css/default.css" />
  15.     <script type="text/javascript">
  16.         $(function() {
  17.             $(".knob").knob();
  18.         });
  19.     </script>
  20.     <link rel="stylesheet" type="text/css" href="http://localhost/db_retribusi/assets/stylesheets/theme.css">
  21.     <link rel="stylesheet" type="text/css" href="http://localhost/db_retribusi/assets/stylesheets/premium.css">
  22. </head>
  23. <body class=" theme-blue">
  24. <script type="text/javascript">
  25.     $(function() {
  26.         var match = document.cookie.match(new RegExp('color=([^;]+)'));
  27.         if(match) var color = match[1];
  28.         if(color) {
  29.             $('body').removeClass(function (index, css) {
  30.                 return (css.match (/\btheme-\S+/g) || []).join(' ')
  31.             })
  32.             $('body').addClass('theme-' + color);
  33.         }
  34.  
  35.         $('[data-popover="true"]').popover({html: true});
  36.        
  37.     });
  38. </script>
  39. <style type="text/css">
  40.     #line-chart {
  41.         height:300px;
  42.         width:800px;
  43.         margin: 0px auto;
  44.         margin-top: 1em;
  45.     }
  46.     .navbar-default .navbar-brand, .navbar-default .navbar-brand:hover {
  47.         color: #fff;
  48.     }
  49. </style>
  50.  
  51. <script type="text/javascript">
  52.     $(function() {
  53.         var uls = $('.sidebar-nav > ul > *').clone();
  54.         uls.addClass('visible-xs');
  55.         $('#main-menu').append(uls.clone());
  56.     });
  57. </script>  
  58. <div class="navbar navbar-default" role="navigation">
  59.     <div class="navbar-header">
  60.         <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
  61.             <span class="sr-only">Toggle navigation</span>
  62.             <span class="icon-bar"></span>
  63.             <span class="icon-bar"></span>
  64.             <span class="icon-bar"></span>
  65.         </button>
  66.         <a class="" href="index.html"><span class="navbar-brand">SRTM</span></a>
  67.     </div>
  68.  
  69.     <div class="navbar-collapse collapse" data-toggle="collapse" style="height: 1px;">
  70.         <ul id="main-menu" class="nav navbar-nav navbar-right">
  71.             <li class="dropdown hidden-xs">
  72.                
  73.             </li>
  74.         </ul>
  75.     </div>
  76. </div>
  77. <div class="sidebar-nav">
  78.     <ul>
  79.         <li><a href="index.php" data-target=".dashboard-menu" class="nav-header" data-toggle="collapse"><i class="fa fa-fw fa-desktop"></i> Dashboard</a></li>
  80.         <li><a href="?page=Pemasukan-Tiket" data-target=".pemasukan-tiket" class="nav-header" data-toggle="collapse"><i class="fa fa-fw fa-th"></i> Pemasukan Tiket</a></li>
  81.         <li><a href="?page=Data-Pemasukan" data-target=".data-pemasukan" class="nav-header" data-toggle="collapse"><i class="fa fa-fw fa-th"></i> Data Pemasukan</a></li>
  82.         <li><a href="javascript:void(0);" data-target=".legal-menu" class="nav-header collapsed" data-toggle="collapse"><i class="fa fa-fw fa-user"></i> Laporan Pemasukan<i class="fa fa-collapse"></i></a></li>
  83.         <li><ul class="legal-menu nav nav-list collapse">
  84.                 <li><a href="?page=Hari-Pengeluaran"><span class="fa fa-angle-double-right"></span> Harian</a></li>
  85.                 <li><a href="?page=Bulan-Pengeluaran"><span class="fa fa-angle-double-right"></span> Bulanan</a></li>
  86.                 <li><a href="?page=Tahun-Pengeluaran"><span class="fa fa-angle-double-right"></span> Tahunan</a></li>
  87.         </ul></li>
  88.         <li><a href="?page=Tambah-Pengeluaran" data-target=".tambah-pengeluaran" class="nav-header" data-toggle="collapse"><i class="fa fa-fw fa-th"></i> Tambah Pengeluaran</a></li>
  89.         <li><a href="?page=Data-Pengeluaran" data-target=".data-pengeluaran" class="nav-header" data-toggle="collapse"><i class="fa fa-fw fa-th"></i> Data Pengeluaran</a></li>
  90.         <li><a href="?page=Grafik-Bulanan" data-target=".grafik-bulan" class="nav-header" data-toggle="collapse"><i class="fa fa-fw fa-th"></i> Grafik Bulan</a></li>
  91.         <li><a href="?page=Log-Out" data-target=".log-out" class="nav-header" data-toggle="collapse"><i class="fa fa-fw fa-sign-out"></i> Log Out</a></li>
  92.     </ul>
  93. </div>
  94. <div class="content">
  95.     <div class="header">
  96.         <h1 class="page-title">Dashboard</h1>
  97.     </div>
  98.  
  99.     <div class="main-content">
  100.         <script src="http://localhost/db_retribusi/assets/lib/highchart/highcharts.js"></script>
  101. <script type="text/javascript">
  102. $(function () {
  103.     var chart;
  104.     $(document).ready(function() {
  105.         chart = new Highcharts.Chart({
  106.             chart: {
  107.                 renderTo: 'chart',
  108.                 type: 'column',
  109.                 marginRight: 130,
  110.                 marginBottom: 25
  111.             },
  112.             title: {
  113.                 text: 'Pemasukan',
  114.                 x: -20 //center
  115.             },
  116.         xAxis: {
  117.          categories: ['Jan', 'Feb', 'Mar', 'Apr', 'Mei', 'Jun',
  118.                           'Jul', 'Ags', 'Sep', 'Okt', 'Nov', 'Des']
  119.         },
  120.         yAxis: {
  121.          title: {
  122.           text: 'Banyak Pemasukan'
  123.          }
  124.         },
  125.         series: [{
  126.          name: 'Bulan',
  127.          data: [{"Januari":"0","Februari":"0","Maret":"2","April":"200","Mei":"20","Juni":"0","Juli":"0","Agustus":"0","September":"0","Oktober":"0","November":"0","Desember":"0"}]        }]
  128.  });
  129. });
  130. });
  131. </script>
  132. <div id="chart" style="min-width: 400px;
  133. height: 400px; margin: 0 auto"></div>       <footer>
  134.             <hr>
  135.             <p>&copy; 2015 SRTM</p>
  136.         </footer>
  137.     </div>
  138. </div>
  139. <script src="http://localhost/db_retribusi/assets/lib/bootstrap/js/bootstrap.js"></script>
  140. </body>
  141. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!