Laju Pertumbuhan Penduduk

+<!
DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Simulasi Prediksi Penduduk Dengan Javascript</title>
+ <link href="bootstrap.min.css" rel="stylesheet"/>
+ <style type="text/css">
+ * {
+ margin: 0;
+ padding: 0;
+ }
+
+ html {
+ position: relative;
+ min-height: 100%;
+ }
+
+ body {
+ margin: 0 0 40px;
+ background-color: #efeddf;
+
+ }
+ .content {
+ padding: 10px;
+ }
+ .panel {
+ background-color: #ffffcc;
+ }
+
+ #wrapper{
+ margin: 0 auto;
+ width: 960px;
+ }
+ #footer {
+ position: absolute;
+ left: 0;
+ bottom: 0;
+ min-height: 40px;
+ width: 100%;
+ background-color: #222222;
+ border-top: 1px solid #000000;
+ color: #f5f5f5;
+ padding-top: 10px;
+ text-align: center;
+ }
+ .form-group{
+ display: inline-block;
+ }
+ .table > thead > tr > th {
+ vertical-align: middle;
+ }
+
+ .table > tbody > tr > td {
+ vertical-align: middle;
+ }
+ .rarrow {
+ position: relative;
+ top: -0.5ex;
+ margin: 0px 2px;
+ }
+ .larrow {
+ position: absolute;
+ left: 0px;
+ top: 0.8ex;
+ }
+ </style>
+ <script src="jquery.js" type="text/javascript"></script>
+ <script type="text/javascript">
+ $(function(){
+ $('input.number').keyup(function (event) {
+ /*
+ if (event.which >= 37 && event.which <= 40) {
+ event.preventDefault();
+ }
+ */
+ var $this = $(this);
+ console.log('start');
+ var num = $this.val().replace(/\W/, '');
+ console.log(num);
+
+ num = num.replace(/ /g, '');
+
+ num = num.split('.').join('');
+ //num = num.replace(" ", "");
+ console.log(num);
+ num = parseInt(num);
+ if(isNaN(num)) num=0;
+ console.log(num);
+ num = num.toString();
+ var value = num.replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1 ");
+ console.log(value);
+ value = value.replace(/ /g, '.');
+
+ $this.val(value);
+ });
+
+ $('.table').hide();
+
+ $('#hitung').on('click', function() {
+ $('.table').fadeIn("slow");
+ // $('.table').show();
+ $(".table>tbody").html("");
+ var p80 = parseInt($('#p80').val().replace(/[\s.]+/g, ''));
+ var laju80 = parseFloat($('#laju80').val());
+ var t = parseInt($('#t').val());
+ var dt = parseInt($('#dt').val());
+
+ var p = new Array();
+
+ p[0] = p80;
+ jlh = "";
+ laju = 0;
+ for(i=1;i<=dt+1;i+=t){
+ if(i>0 && i<10){
+ p[i]= p[i-1]+((laju80/100)*p[i-1])*t;
+ laju = laju80;
+ }
+ else if(i==10){
+ p[i]= p90;
+ laju = laju80;
+ }
+ else if(i>10 && i<20){
+ p[i]= p[i-1]+((laju90/100)*p[i-1])*t;
+ laju = laju90;
+ }
+ else if(i==20){
+ p[i]= p20;
+ laju = laju90;
+ }
+ else if(i>20 && i<30){
+ p[i]= p[i-1]+((laju20/100)*p[i-1])*t;
+ laju = laju20;
+ }
+ else if(i==30){
+ p[i]= p2010;
+ laju = laju20;
+ }
+ else{
+ p[i]= p[i-1]+((laju20/100)*p[i-1])*t;
+ laju = laju20;
+ }
+
+ jlh = Math.round(p[i-1]); //replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1 ")
+ $('.table>tbody').append("<tr><td>"+(1980+(i-
1))+"</td><td>"+jlh.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1 ").replace(/ /g,
'.')+"</td><td>"+laju+"</td></tr>");
+ }
+
+ });
+
+
+ });
+ </script>
+</head>
+
+<body>
+ <div id="wrapper" class="container well">
+
+ <div class="rows">
+ <div class="col-md-12">
+ <h1 class="text-center">Simulasi Prediksi Penduduk Indonesia
menurut Provinsi 1980, 1990, 2000 dan 2010</h1>
+ </div>
+ </div>
+
+
+ <div class="content col-md-12">
+
+ <div class="form-group col-md-6">
+ <label for="p80">Jumlah Penduduk Tahun 1980 :
</label><input class="form-control number" type="text" name="p80" id="p80" value="147.490.298"
placeholder="Jumlah Penduduk Tahun 1980">
+ </div>
+ <label for="laju80">Laju Pertumbuhan Penduduk
(1980-1990) : </label><input class="form-control" type="text" name="laju80" id="laju80"
value="1.98" placeholder="Laju Pertumbuhan Penduduk (1980-1990)">
+ </div>
+ </div>
+ </div>
(1990-2000) : </label><input class="form-control" type="text" name="laju90" id="laju90"
+ </div>
+ </div>
+
+ </div>
+
(2000-2010) : </label> <input class="form-control" type="text" name="laju20" id="laju20"
+ </div>
+ </div>
+
</label><input class="form-control number" type="text" name="p2010" id="p2010"
value="237.641.326" placeholder="Jumlah Penduduk Tahun 2010">
+ </div>
+ </div>
+ <div class="clearfix"></div>
+ <label for="t">Interval (tahun) : </label><input
class="form-control" type="text" name="t" id="t" value="1" placeholder="Interval (tahun)">
+ </div>
+
+ <label for="dt">Waktu (tahun) : </label> <input
class="form-control" type="text" name="dt" id="dt" value="70" placeholder="Waktu (tahun)">
+ </div>
+ </div>
+
+ <button id="hitung" class="btn btn-default col-md-
3">Hitung</button>
+ <span class="col-md-1"> </span>
+ <button onclick="location.reload();" class="btn btn-
default col-md-3">Reset</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div id="wrapper" class="container well">
+ <table id="data" class="table table-striped">
+ <thead>
+ <tr>
+ <th>Tahun</th>
+ <th>Jumlah Penduduk</th>
+ <th>Laju Pertumbuhan</th>
+ </tr>
+ </thead>
+ <tbody>
+
+ </tbody>
+ </table>
+ </div>
+
+ <div id="footer">
+ © Copyright 2013 Mikroskil by Wahyu
+ </div>
+</body>
+</html>

Laju Pertumbuhan Penduduk

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Laju Pertumbuhan Penduduk

Uploaded by

Copyright:

Available Formats

+<!

You might also like