Fecino
/
Inspinia
ウォッチ 3
スター 0
フォーク 0
コード 課題 0 プルリクエスト 0 リリース 0 Wiki アクティビティ
Theme Inspinia
選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。
1 コミット
1 ブランチ
ツリー: cded54dbee
ブランチ タグ
${ item.name }
ブランチ ${ searchTerm } を作成
'cded54dbee' から
${ noResults }
Inspinia/dashboard_4.html

dashboard_4.html 32KB
履歴 Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626 
  1. <!DOCTYPE html>

  2. <html>

  3. 

  4. <head>

  5. 

  6.     <meta charset="utf-8">

  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">

  8. 

  9.     <title>INSPINIA | Dashboard v.4</title>

  10. 

  11.     <link href="css/bootstrap.min.css" rel="stylesheet">

  12.     <link href="font-awesome/css/font-awesome.css" rel="stylesheet">

  13.     <link href="css/animate.css" rel="stylesheet">

  14.     <link href="css/style.css" rel="stylesheet">

  15. 

  16. </head>

  17. 

  18. <body class="top-navigation">

  19. 

  20.     <div id="wrapper">

  21.         <div id="page-wrapper" class="gray-bg">

  22.         <div class="row border-bottom white-bg">

  23.         <nav class="navbar navbar-static-top" role="navigation">

  24.             <div class="navbar-header">

  25.                 <button aria-controls="navbar" aria-expanded="false" data-target="#navbar" data-toggle="collapse" class="navbar-toggle collapsed" type="button">

  26.                     <i class="fa fa-reorder"></i>

  27.                 </button>

  28.                 <a href="#" class="navbar-brand">Inspinia</a>

  29.             </div>

  30.             <div class="navbar-collapse collapse" id="navbar">

  31.                 <ul class="nav navbar-nav">

  32.                     <li class="active">

  33.                         <a aria-expanded="false" role="button" href="layouts.html"> Back to main Layout page</a>

  34.                     </li>

  35.                     <li class="dropdown">

  36.                         <a aria-expanded="false" role="button" href="#" class="dropdown-toggle" data-toggle="dropdown"> Menu item <span class="caret"></span></a>

  37.                         <ul role="menu" class="dropdown-menu">

  38.                             <li><a href="">Menu item</a></li>

  39.                             <li><a href="">Menu item</a></li>

  40.                             <li><a href="">Menu item</a></li>

  41.                             <li><a href="">Menu item</a></li>

  42.                         </ul>

  43.                     </li>

  44.                     <li class="dropdown">

  45.                         <a aria-expanded="false" role="button" href="#" class="dropdown-toggle" data-toggle="dropdown"> Menu item <span class="caret"></span></a>

  46.                         <ul role="menu" class="dropdown-menu">

  47.                             <li><a href="">Menu item</a></li>

  48.                             <li><a href="">Menu item</a></li>

  49.                             <li><a href="">Menu item</a></li>

  50.                             <li><a href="">Menu item</a></li>

  51.                         </ul>

  52.                     </li>

  53.                     <li class="dropdown">

  54.                         <a aria-expanded="false" role="button" href="#" class="dropdown-toggle" data-toggle="dropdown"> Menu item <span class="caret"></span></a>

  55.                         <ul role="menu" class="dropdown-menu">

  56.                             <li><a href="">Menu item</a></li>

  57.                             <li><a href="">Menu item</a></li>

  58.                             <li><a href="">Menu item</a></li>

  59.                             <li><a href="">Menu item</a></li>

  60.                         </ul>

  61.                     </li>

  62.                     <li class="dropdown">

  63.                         <a aria-expanded="false" role="button" href="#" class="dropdown-toggle" data-toggle="dropdown"> Menu item <span class="caret"></span></a>

  64.                         <ul role="menu" class="dropdown-menu">

  65.                             <li><a href="">Menu item</a></li>

  66.                             <li><a href="">Menu item</a></li>

  67.                             <li><a href="">Menu item</a></li>

  68.                             <li><a href="">Menu item</a></li>

  69.                         </ul>

  70.                     </li>

  71. 

  72.                 </ul>

  73.                 <ul class="nav navbar-top-links navbar-right">

  74.                     <li>

  75.                         <a href="login.html">

  76.                             <i class="fa fa-sign-out"></i> Log out

  77.                         </a>

  78.                     </li>

  79.                 </ul>

  80.             </div>

  81.         </nav>

  82.         </div>

  83.         <div class="wrapper wrapper-content">

  84.             <div class="container">

  85.             <div class="row">

  86.                 <div class="col-md-2">

  87.                     <div class="ibox float-e-margins">

  88.                         <div class="ibox-title">

  89.                             <span class="label label-success pull-right">Monthly</span>

  90.                             <h5>Views</h5>

  91.                         </div>

  92.                         <div class="ibox-content">

  93.                             <h1 class="no-margins">386,200</h1>

  94.                             <div class="stat-percent font-bold text-success">98% <i class="fa fa-bolt"></i></div>

  95.                             <small>Total views</small>

  96.                         </div>

  97.                     </div>

  98.                 </div>

  99.                 <div class="col-md-2">

  100.                     <div class="ibox float-e-margins">

  101.                         <div class="ibox-title">

  102.                             <span class="label label-info pull-right">Annual</span>

  103.                             <h5>Orders</h5>

  104.                         </div>

  105.                         <div class="ibox-content">

  106.                                     <h1 class="no-margins">80,800</h1>

  107.                                     <div class="stat-percent font-bold text-info">20% <i class="fa fa-level-up"></i></div>

  108.                                     <small>New orders</small>

  109.                         </div>

  110.                     </div>

  111.                 </div>

  112. 

  113.                 <div class="col-md-4">

  114.                     <div class="ibox float-e-margins">

  115.                         <div class="ibox-title">

  116.                             <span class="label label-primary pull-right">Today</span>

  117.                             <h5>Vistits</h5>

  118.                         </div>

  119.                         <div class="ibox-content">

  120. 

  121.                             <div class="row">

  122.                                 <div class="col-md-6">

  123.                                     <h1 class="no-margins">$ 406,420</h1>

  124.                                     <div class="font-bold text-navy">44% <i class="fa fa-level-up"></i> <small>Rapid pace</small></div>

  125.                                 </div>

  126.                                 <div class="col-md-6">

  127.                                     <h1 class="no-margins">206,120</h1>

  128.                                     <div class="font-bold text-navy">22% <i class="fa fa-level-up"></i> <small>Slow pace</small></div>

  129.                                 </div>

  130.                             </div>

  131. 

  132. 

  133.                         </div>

  134.                     </div>

  135.                 </div>

  136.                 <div class="col-md-4">

  137.                     <div class="ibox float-e-margins">

  138.                         <div class="ibox-title">

  139.                             <h5>Monthly income</h5>

  140.                             <div class="ibox-tools">

  141.                                 <span class="label label-primary">Updated 12.2015</span>

  142.                             </div>

  143.                         </div>

  144.                         <div class="ibox-content no-padding">

  145.                             <div class="flot-chart m-t-lg" style="height: 55px;">

  146.                                 <div class="flot-chart-content" id="flot-chart1"></div>

  147.                             </div>

  148.                         </div>

  149. 

  150.                     </div>

  151.                 </div>

  152.             </div>

  153.                 <div class="row">

  154.                     <div class="col-lg-8">

  155.                         <div class="ibox float-e-margins">

  156.                             <div class="ibox-content">

  157.                                 <div>

  158.                                         <span class="pull-right text-right">

  159.                                         <small>Average value of sales in the past month in: <strong>United states</strong></small>

  160.                                             <br/>

  161.                                             All sales: 162,862

  162.                                         </span>

  163.                                     <h3 class="font-bold no-margins">

  164.                                         Half-year revenue margin

  165.                                     </h3>

  166.                                     <small>Sales marketing.</small>

  167.                                 </div>

  168. 

  169.                                 <div class="m-t-sm">

  170. 

  171.                                     <div class="row">

  172.                                         <div class="col-md-8">

  173.                                             <div>

  174.                                             <canvas id="lineChart" height="114"></canvas>

  175.                                             </div>

  176.                                         </div>

  177.                                         <div class="col-md-4">

  178.                                             <ul class="stat-list m-t-lg">

  179.                                                 <li>

  180.                                                     <h2 class="no-margins">2,346</h2>

  181.                                                     <small>Total orders in period</small>

  182.                                                     <div class="progress progress-mini">

  183.                                                         <div class="progress-bar" style="width: 48%;"></div>

  184.                                                     </div>

  185.                                                 </li>

  186.                                                 <li>

  187.                                                     <h2 class="no-margins ">4,422</h2>

  188.                                                     <small>Orders in last month</small>

  189.                                                     <div class="progress progress-mini">

  190.                                                         <div class="progress-bar" style="width: 60%;"></div>

  191.                                                     </div>

  192.                                                 </li>

  193.                                             </ul>

  194.                                         </div>

  195.                                     </div>

  196. 

  197.                                 </div>

  198. 

  199.                                 <div class="m-t-md">

  200.                                     <small class="pull-right">

  201.                                         <i class="fa fa-clock-o"> </i>

  202.                                         Update on 16.07.2015

  203.                                     </small>

  204.                                     <small>

  205.                                         <strong>Analysis of sales:</strong> The value has been changed over time, and last month reached a level over $50,000.

  206.                                     </small>

  207.                                 </div>

  208. 

  209.                             </div>

  210.                         </div>

  211.                     </div>

  212.                     <div class="col-lg-4">

  213.                         <div class="ibox float-e-margins">

  214.                             <div class="ibox-title">

  215.                                 <span class="label label-warning pull-right">Data has changed</span>

  216.                                 <h5>User activity</h5>

  217.                             </div>

  218.                             <div class="ibox-content">

  219.                                 <div class="row">

  220.                                     <div class="col-xs-4">

  221.                                         <small class="stats-label">Pages / Visit</small>

  222.                                         <h4>236 321.80</h4>

  223.                                     </div>

  224. 

  225.                                     <div class="col-xs-4">

  226.                                         <small class="stats-label">% New Visits</small>

  227.                                         <h4>46.11%</h4>

  228.                                     </div>

  229.                                     <div class="col-xs-4">

  230.                                         <small class="stats-label">Last week</small>

  231.                                         <h4>432.021</h4>

  232.                                     </div>

  233.                                 </div>

  234.                             </div>

  235.                             <div class="ibox-content">

  236.                                 <div class="row">

  237.                                     <div class="col-xs-4">

  238.                                         <small class="stats-label">Pages / Visit</small>

  239.                                         <h4>643 321.10</h4>

  240.                                     </div>

  241. 

  242.                                     <div class="col-xs-4">

  243.                                         <small class="stats-label">% New Visits</small>

  244.                                         <h4>92.43%</h4>

  245.                                     </div>

  246.                                     <div class="col-xs-4">

  247.                                         <small class="stats-label">Last week</small>

  248.                                         <h4>564.554</h4>

  249.                                     </div>

  250.                                 </div>

  251.                             </div>

  252.                             <div class="ibox-content">

  253.                                 <div class="row">

  254.                                     <div class="col-xs-4">

  255.                                         <small class="stats-label">Pages / Visit</small>

  256.                                         <h4>436 547.20</h4>

  257.                                     </div>

  258. 

  259.                                     <div class="col-xs-4">

  260.                                         <small class="stats-label">% New Visits</small>

  261.                                         <h4>150.23%</h4>

  262.                                     </div>

  263.                                     <div class="col-xs-4">

  264.                                         <small class="stats-label">Last week</small>

  265.                                         <h4>124.990</h4>

  266.                                     </div>

  267.                                 </div>

  268.                             </div>

  269.                         </div>

  270.                     </div>

  271. 

  272.                 </div>

  273. 

  274.                 <div class="row">

  275. 

  276.                     <div class="col-lg-12">

  277.                         <div class="ibox float-e-margins">

  278.                             <div class="ibox-title">

  279.                                 <h5>Custom responsive table </h5>

  280.                                 <div class="ibox-tools">

  281.                                     <a class="collapse-link">

  282.                                         <i class="fa fa-chevron-up"></i>

  283.                                     </a>

  284.                                     <a class="dropdown-toggle" data-toggle="dropdown" href="#">

  285.                                         <i class="fa fa-wrench"></i>

  286.                                     </a>

  287.                                     <ul class="dropdown-menu dropdown-user">

  288.                                         <li><a href="#">Config option 1</a>

  289.                                         </li>

  290.                                         <li><a href="#">Config option 2</a>

  291.                                         </li>

  292.                                     </ul>

  293.                                     <a class="close-link">

  294.                                         <i class="fa fa-times"></i>

  295.                                     </a>

  296.                                 </div>

  297.                             </div>

  298.                             <div class="ibox-content">

  299.                                 <div class="row">

  300.                                     <div class="col-sm-9 m-b-xs">

  301.                                         <div data-toggle="buttons" class="btn-group">

  302.                                             <label class="btn btn-sm btn-white"> <input type="radio" id="option1" name="options"> Day </label>

  303.                                             <label class="btn btn-sm btn-white active"> <input type="radio" id="option2" name="options"> Week </label>

  304.                                             <label class="btn btn-sm btn-white"> <input type="radio" id="option3" name="options"> Month </label>

  305.                                         </div>

  306.                                     </div>

  307.                                     <div class="col-sm-3">

  308.                                         <div class="input-group"><input type="text" placeholder="Search" class="input-sm form-control"> <span class="input-group-btn">

  309.                                         <button type="button" class="btn btn-sm btn-primary"> Go!</button> </span></div>

  310.                                     </div>

  311.                                 </div>

  312.                                 <div class="table-responsive">

  313.                                     <table class="table table-striped">

  314.                                         <thead>

  315.                                         <tr>

  316. 

  317.                                             <th>#</th>

  318.                                             <th>Project </th>

  319.                                             <th>Name </th>

  320.                                             <th>Phone </th>

  321.                                             <th>Company </th>

  322.                                             <th>Completed </th>

  323.                                             <th>Task</th>

  324.                                             <th>Date</th>

  325.                                             <th>Action</th>

  326.                                         </tr>

  327.                                         </thead>

  328.                                         <tbody>

  329.                                         <tr>

  330.                                             <td>1</td>

  331.                                             <td>Project <small>This is example of project</small></td>

  332.                                             <td>Patrick Smith</td>

  333.                                             <td>0800 051213</td>

  334.                                             <td>Inceptos Hymenaeos Ltd</td>

  335.                                             <td><span class="pie">0.52/1.561</span></td>

  336.                                             <td>20%</td>

  337.                                             <td>Jul 14, 2013</td>

  338.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  339.                                         </tr>

  340.                                         <tr>

  341.                                             <td>2</td>

  342.                                             <td>Alpha project</td>

  343.                                             <td>Alice Jackson</td>

  344.                                             <td>0500 780909</td>

  345.                                             <td>Nec Euismod In Company</td>

  346.                                             <td><span class="pie">6,9</span></td>

  347.                                             <td>40%</td>

  348.                                             <td>Jul 16, 2013</td>

  349.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  350.                                         </tr>

  351.                                         <tr>

  352.                                             <td>3</td>

  353.                                             <td>Betha project</td>

  354.                                             <td>John Smith</td>

  355.                                             <td>0800 1111</td>

  356.                                             <td>Erat Volutpat</td>

  357.                                             <td><span class="pie">3,1</span></td>

  358.                                             <td>75%</td>

  359.                                             <td>Jul 18, 2013</td>

  360.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  361.                                         </tr>

  362.                                         <tr>

  363.                                             <td>4</td>

  364.                                             <td>Gamma project</td>

  365.                                             <td>Anna Jordan</td>

  366.                                             <td>(016977) 0648</td>

  367.                                             <td>Tellus Ltd</td>

  368.                                             <td><span class="pie">4,9</span></td>

  369.                                             <td>18%</td>

  370.                                             <td>Jul 22, 2013</td>

  371.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  372.                                         </tr>

  373.                                         <tr>

  374.                                             <td>2</td>

  375.                                             <td>Alpha project</td>

  376.                                             <td>Alice Jackson</td>

  377.                                             <td>0500 780909</td>

  378.                                             <td>Nec Euismod In Company</td>

  379.                                             <td><span class="pie">6,9</span></td>

  380.                                             <td>40%</td>

  381.                                             <td>Jul 16, 2013</td>

  382.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  383.                                         </tr>

  384.                                         <tr>

  385.                                             <td>1</td>

  386.                                             <td>Project <small>This is example of project</small></td>

  387.                                             <td>Patrick Smith</td>

  388.                                             <td>0800 051213</td>

  389.                                             <td>Inceptos Hymenaeos Ltd</td>

  390.                                             <td><span class="pie">0.52/1.561</span></td>

  391.                                             <td>20%</td>

  392.                                             <td>Jul 14, 2013</td>

  393.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  394.                                         </tr>

  395.                                         <tr>

  396.                                             <td>4</td>

  397.                                             <td>Gamma project</td>

  398.                                             <td>Anna Jordan</td>

  399.                                             <td>(016977) 0648</td>

  400.                                             <td>Tellus Ltd</td>

  401.                                             <td><span class="pie">4,9</span></td>

  402.                                             <td>18%</td>

  403.                                             <td>Jul 22, 2013</td>

  404.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  405.                                         </tr>

  406.                                         <tr>

  407.                                             <td>1</td>

  408.                                             <td>Project <small>This is example of project</small></td>

  409.                                             <td>Patrick Smith</td>

  410.                                             <td>0800 051213</td>

  411.                                             <td>Inceptos Hymenaeos Ltd</td>

  412.                                             <td><span class="pie">0.52/1.561</span></td>

  413.                                             <td>20%</td>

  414.                                             <td>Jul 14, 2013</td>

  415.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  416.                                         </tr>

  417.                                         <tr>

  418.                                             <td>2</td>

  419.                                             <td>Alpha project</td>

  420.                                             <td>Alice Jackson</td>

  421.                                             <td>0500 780909</td>

  422.                                             <td>Nec Euismod In Company</td>

  423.                                             <td><span class="pie">6,9</span></td>

  424.                                             <td>40%</td>

  425.                                             <td>Jul 16, 2013</td>

  426.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  427.                                         </tr>

  428.                                         <tr>

  429.                                             <td>3</td>

  430.                                             <td>Betha project</td>

  431.                                             <td>John Smith</td>

  432.                                             <td>0800 1111</td>

  433.                                             <td>Erat Volutpat</td>

  434.                                             <td><span class="pie">3,1</span></td>

  435.                                             <td>75%</td>

  436.                                             <td>Jul 18, 2013</td>

  437.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  438.                                         </tr>

  439.                                         <tr>

  440.                                             <td>4</td>

  441.                                             <td>Gamma project</td>

  442.                                             <td>Anna Jordan</td>

  443.                                             <td>(016977) 0648</td>

  444.                                             <td>Tellus Ltd</td>

  445.                                             <td><span class="pie">4,9</span></td>

  446.                                             <td>18%</td>

  447.                                             <td>Jul 22, 2013</td>

  448.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  449.                                         </tr>

  450.                                         <tr>

  451.                                             <td>2</td>

  452.                                             <td>Alpha project</td>

  453.                                             <td>Alice Jackson</td>

  454.                                             <td>0500 780909</td>

  455.                                             <td>Nec Euismod In Company</td>

  456.                                             <td><span class="pie">6,9</span></td>

  457.                                             <td>40%</td>

  458.                                             <td>Jul 16, 2013</td>

  459.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  460.                                         </tr>

  461.                                         <tr>

  462.                                             <td>1</td>

  463.                                             <td>Project <small>This is example of project</small></td>

  464.                                             <td>Patrick Smith</td>

  465.                                             <td>0800 051213</td>

  466.                                             <td>Inceptos Hymenaeos Ltd</td>

  467.                                             <td><span class="pie">0.52/1.561</span></td>

  468.                                             <td>20%</td>

  469.                                             <td>Jul 14, 2013</td>

  470.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  471.                                         </tr>

  472.                                         <tr>

  473.                                             <td>4</td>

  474.                                             <td>Gamma project</td>

  475.                                             <td>Anna Jordan</td>

  476.                                             <td>(016977) 0648</td>

  477.                                             <td>Tellus Ltd</td>

  478.                                             <td><span class="pie">4,9</span></td>

  479.                                             <td>18%</td>

  480.                                             <td>Jul 22, 2013</td>

  481.                                             <td><a href="#"><i class="fa fa-check text-navy"></i></a></td>

  482.                                         </tr>

  483.                                         </tbody>

  484.                                     </table>

  485.                                 </div>

  486. 

  487.                             </div>

  488.                         </div>

  489.                     </div>

  490. 

  491.                 </div>

  492. 

  493.             </div>

  494. 

  495.         </div>

  496.         <div class="footer">

  497.             <div class="pull-right">

  498.                 10GB of <strong>250GB</strong> Free.

  499.             </div>

  500.             <div>

  501.                 <strong>Copyright</strong> Example Company &copy; 2014-2015

  502.             </div>

  503.         </div>

  504. 

  505.         </div>

  506.         </div>

  507. 

  508. 

  509. 

  510.     <!-- Mainly scripts -->

  511.     <script src="js/jquery-2.1.1.js"></script>

  512.     <script src="js/bootstrap.min.js"></script>

  513.     <script src="js/plugins/metisMenu/jquery.metisMenu.js"></script>

  514.     <script src="js/plugins/slimscroll/jquery.slimscroll.min.js"></script>

  515. 

  516.     <!-- Custom and plugin javascript -->

  517.     <script src="js/inspinia.js"></script>

  518.     <script src="js/plugins/pace/pace.min.js"></script>

  519. 

  520.     <!-- Flot -->

  521.     <script src="js/plugins/flot/jquery.flot.js"></script>

  522.     <script src="js/plugins/flot/jquery.flot.tooltip.min.js"></script>

  523.     <script src="js/plugins/flot/jquery.flot.resize.js"></script>

  524. 

  525.     <!-- ChartJS-->

  526.     <script src="js/plugins/chartJs/Chart.min.js"></script>

  527. 

  528.     <!-- Peity -->

  529.     <script src="js/plugins/peity/jquery.peity.min.js"></script>

  530.     <!-- Peity demo -->

  531.     <script src="js/demo/peity-demo.js"></script>

  532. 

  533. 

  534.     <script>

  535.         $(document).ready(function() {

  536. 

  537. 

  538.             var d1 = [[1262304000000, 6], [1264982400000, 3057], [1267401600000, 20434], [1270080000000, 31982], [1272672000000, 26602], [1275350400000, 27826], [1277942400000, 24302], [1280620800000, 24237], [1283299200000, 21004], [1285891200000, 12144], [1288569600000, 10577], [1291161600000, 10295]];

  539.             var d2 = [[1262304000000, 5], [1264982400000, 200], [1267401600000, 1605], [1270080000000, 6129], [1272672000000, 11643], [1275350400000, 19055], [1277942400000, 30062], [1280620800000, 39197], [1283299200000, 37000], [1285891200000, 27000], [1288569600000, 21000], [1291161600000, 17000]];

  540. 

  541.             var data1 = [

  542.                 { label: "Data 1", data: d1, color: '#17a084'},

  543.                 { label: "Data 2", data: d2, color: '#127e68' }

  544.             ];

  545.             $.plot($("#flot-chart1"), data1, {

  546.                 xaxis: {

  547.                     tickDecimals: 0

  548.                 },

  549.                 series: {

  550.                     lines: {

  551.                         show: true,

  552.                         fill: true,

  553.                         fillColor: {

  554.                             colors: [{

  555.                                 opacity: 1

  556.                             }, {

  557.                                 opacity: 1

  558.                             }]

  559.                         },

  560.                     },

  561.                     points: {

  562.                         width: 0.1,

  563.                         show: false

  564.                     },

  565.                 },

  566.                 grid: {

  567.                     show: false,

  568.                     borderWidth: 0

  569.                 },

  570.                 legend: {

  571.                     show: false,

  572.                 }

  573.             });

  574. 

  575.             var lineData = {

  576.                 labels: ["January", "February", "March", "April", "May", "June", "July"],

  577.                 datasets: [

  578.                     {

  579.                         label: "Example dataset",

  580.                         fillColor: "rgba(220,220,220,0.5)",

  581.                         strokeColor: "rgba(220,220,220,1)",

  582.                         pointColor: "rgba(220,220,220,1)",

  583.                         pointStrokeColor: "#fff",

  584.                         pointHighlightFill: "#fff",

  585.                         pointHighlightStroke: "rgba(220,220,220,1)",

  586.                         data: [65, 59, 40, 51, 36, 25, 40]

  587.                     },

  588.                     {

  589.                         label: "Example dataset",

  590.                         fillColor: "rgba(26,179,148,0.5)",

  591.                         strokeColor: "rgba(26,179,148,0.7)",

  592.                         pointColor: "rgba(26,179,148,1)",

  593.                         pointStrokeColor: "#fff",

  594.                         pointHighlightFill: "#fff",

  595.                         pointHighlightStroke: "rgba(26,179,148,1)",

  596.                         data: [48, 48, 60, 39, 56, 37, 30]

  597.                     }

  598.                 ]

  599.             };

  600. 

  601.             var lineOptions = {

  602.                 scaleShowGridLines: true,

  603.                 scaleGridLineColor: "rgba(0,0,0,.05)",

  604.                 scaleGridLineWidth: 1,

  605.                 bezierCurve: true,

  606.                 bezierCurveTension: 0.4,

  607.                 pointDot: true,

  608.                 pointDotRadius: 4,

  609.                 pointDotStrokeWidth: 1,

  610.                 pointHitDetectionRadius: 20,

  611.                 datasetStroke: true,

  612.                 datasetStrokeWidth: 2,

  613.                 datasetFill: true,

  614.                 responsive: true,

  615.             };

  616. 

  617. 

  618.             var ctx = document.getElementById("lineChart").getContext("2d");

  619.             var myNewChart = new Chart(ctx).Line(lineData, lineOptions);

  620. 

  621.         });

  622.     </script>

  623. 

  624. </body>

  625. 

  626. </html>