Skip to content

Project / eis_sipkd

Go to a project
Commit 6d0142d9 by aa.gusti
Options

grafik

1 parent b137799c
Inline Side-by-side
Showing 1 changed file with 252 additions and 266 deletions
views/templates/grafik.pt
...@@ -75,28 +75,8 @@ ...@@ -75,28 +75,8 @@
body { body {
/*background-image: url("static/img/bg1.jpg");*/ /*background-image: url("static/img/bg1.jpg");*/
} }
.judul { .table-title {
margin-top: 10px; background-color:rgb(35, 125, 38);
color: #777;
font-size: 40px;
font-weight: normal;
padding-left:0px;
}
@media (min-width: 767px) {
.judul {
margin-top: 10px;
color: #777;
font-size: 40px;
font-weight: normal;
padding-left:320px;
}
}
.subjudul {
margin-bottom: 0px;
margin-bottom: 20px;
color: #777;
padding-left:0px;
} }
@media (min-width: 767px) { @media (min-width: 767px) {
.subjudul { .subjudul {
...@@ -118,287 +98,293 @@ ...@@ -118,287 +98,293 @@
</style> </style>
<!-- menu left --> <!-- menu left -->
<div class="container"> <div class="container">
<!--div class="row" style="background-color:rgb(255,255,255); padding-top:15px;">
<div class="col-md-2"> <div class="col-md-12 latar">
<div class="isi">
<div class="row">
<div class="col-md-2 header" style="padding-top:5px;">
<img class="" src="/static/img/logo.png" style="height:80px; width:80px;padding-bottom:5px;"> <img class="" src="/static/img/logo.png" style="height:80px; width:80px;padding-bottom:5px;">
</div> </div>
<div class="col-md-8"> <div class="col-md-10 judul">
<h3 style="margin-top:5px;">EKSEKUTIF SUMMARY PAJAK DAERAH</h3> EKSEKUTIF SUMMARY KEUANGAN DAERAH<br>
<h4>Tahun ${request.session['tahun']}</h4> Tahun ${request.session['tahun']}
</div> </div>
</div--> </div>
<div class="row">
<div class="col-md-6 "> <div class="row">
<div class="col-md-12"> <div class="col-md-6 ">
<div id="chart-line-101"> <div class="col-md-12">
<div class="row"> <div id="chart-line-101">
<center> <div class="row">
<div class="row"> <center>
<div class="col-md-12 table-title" style="border-right: 2px solid #000000;"> <div class="row">
REALISASI KUMULATIF PENDAPATAN DAN BELANJA <div class="col-md-12 table-title" style="border-right: 2px solid #FFFFFF;">
REALISASI KUMULATIF PENDAPATAN DAN BELANJA
</div>
</div> </div>
</div> <div class="row">
<div class="row"> <div class="col-md-12">
<div class="col-md-12"> <canvas id="canvas_101"></canvas>
<canvas id="canvas_101"></canvas> </div>
<!-- <div class="col-md-2"> -->
<!-- <h5>Keterangan</h5> -->
<!-- <div id="legend_101"></div> -->
<!-- </div> -->
</div> </div>
<!-- <div class="col-md-2"> -->
<!-- <h5>Keterangan</h5> -->
<!-- <div id="legend_101"></div> -->
<!-- </div> -->
</div>
</center>
</div>
<script>
var lineChartData_101 = {
labels : [],
datasets : [
{
label: "Pendapatan",
borderColor:"rgb(255, 99, 132)",
//lineTension: 0.2,
fill:false,
data : [],
borderWidth:1,
}, </center>
{ </div>
label: "Belanja", <script>
borderColor:"rgb(215, 196, 255)", var lineChartData_101 = {
//lineTension: 0.2, labels : [],
fill:false, datasets : [
data : [], {
borderWidth:1, label: "Pendapatan",
} borderColor:"rgb(255, 99, 132)",
] //lineTension: 0.2,
fill:false,
data : [],
borderWidth:1,
},
{
label: "Belanja",
borderColor:"rgb(215, 196, 255)",
//lineTension: 0.2,
fill:false,
data : [],
borderWidth:1,
}
]
} }
$(function(){ $(function(){
var ctx_101 = document.getElementById("canvas_101").getContext("2d"); var ctx_101 = document.getElementById("canvas_101").getContext("2d");
$.ajax({ $.ajax({
type: "POST", type: "POST",
url: "/eis/sipkd/grafik/linebar/act", url: "/eis/sipkd/grafik/linebar/act",
data: "id=101", data: "id=101",
success: function (html) { success: function (html) {
if (html.success == true) { if (html.success == true) {
for (i = 0; i < html.label.length; i++) { for (i = 0; i < html.label.length; i++) {
lineChartData_101.labels.push(html.label[i]); lineChartData_101.labels.push(html.label[i]);
lineChartData_101.datasets[0].data.push(html.target[i]); lineChartData_101.datasets[0].data.push(html.target[i]);
lineChartData_101.datasets[1].data.push(html.realisasi[i]); lineChartData_101.datasets[1].data.push(html.realisasi[i]);
}
window.myLine_101 = new Chart(ctx_101, {
type: 'line',
data: lineChartData_101,
options: barLineOptions,
});
} }
window.myLine_101 = new Chart(ctx_101, { },
type: 'line', beforeSend: function () {
data: lineChartData_101,
options: barLineOptions,
});
} }
}, });
beforeSend: function () {
}
}); });
});
</script> </script>
</div>
</div> </div>
</div>
<div class="col-md-6">
<div class="col-md-12">
<div id="chart-bar-102" >
<div class="row">
<center>
<div class="row">
<div class="col-md-12 table-title">
REALISASI PENDAPATAN DAN BELANJA
</div>
</div>
<div class="row">
<div class="col-md-12">
<canvas id="canvas_102"></canvas>
</div>
</div>
</center>
</div>
<script>
var barChartData_102 = {
labels : [],
datasets : [
{
label: "Pendapatan",
backgroundColor: "rgba(254, 223, 229,0.2)",
borderColor:"rgb(255, 99, 132)",
borderWidth:1,
data : []
},
{
label: "Belanja",
backgroundColor: "rgba(234, 223, 254,0.2)",
borderColor:"rgb(215, 196, 255)",
borderWidth:1,
data : []
}
]
}
var ctx_102 = $("#canvas_102").get(0).getContext("2d");
$(function(){
//GET DATA FROM SERVER
$.ajax({
type: "POST",
url: "/eis/sipkd/grafik/linebar/act",
data: "id=102",
success: function (html) {
if (html.success == true) {
for (i = 0; i < html.label.length; i++) {
barChartData_102.labels.push(html.label[i]);
barChartData_102.datasets[0].data.push(html.target[i]);
barChartData_102.datasets[1].data.push(html.realisasi[i]);
}
window.myBar_102 = new Chart(ctx_102, {
type: 'bar',
data: barChartData_102,
options: barLineOptions
});
}
},
beforeSend: function () {
}
});
});
</script>
</div>
</div>
</div>
</div> </div>
</div>
<div class="col-md-6"> <div class="row">
<div class="col-md-12"> <div class="col-md-6">
<div id="chart-bar-102" > <div class="col-md-12">
<div id="chart-line-103" >
<div class="row"> <div class="row">
<center> <center>
<div class="row"> <div class="row">
<div class="col-md-12 table-title"> <div class="col-md-12 table-title" style="border-right: 2px solid #FFFFFF;">
REALISASI PENDAPATAN DAN BELANJA KOMPOSISI REALISASI PENDAPATAN
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-9 col-md-offset-1">
<canvas id="canvas_102"></canvas> <canvas id="canvas_103"></canvas>
</div> </div>
</div> </div>
</center> </center>
</div> </div>
<script> <script>
var barChartData_102 = { var pieData_103 = {
labels : [], datasets: [{
datasets : [ data: [],
{ backgroundColor: []
label: "Pendapatan", }],
backgroundColor: "rgba(254, 223, 229,0.2)", labels: [],
borderColor:"rgb(255, 99, 132)", }
borderWidth:1,
data : []
},
{
label: "Belanja",
backgroundColor: "rgba(234, 223, 254,0.2)",
borderColor:"rgb(215, 196, 255)",
borderWidth:1,
data : []
}
]
}
var ctx_102 = $("#canvas_102").get(0).getContext("2d");
$(function(){ $(function(){
//GET DATA FROM SERVER var ctx_103 = document.getElementById("canvas_103").getContext("2d");
var npie = 0 ;
$.ajax({ $.ajax({
type: "POST", type: "POST",
url: "/eis/sipkd/grafik/linebar/act", url: "/eis/sipkd/grafik/pie/act",
data: "id=102", data: "id=103",
success: function (html) { success: function (html) {
if (html.success == true) { if (html.success == true) {
for (i = 0; i < html.label.length; i++) { jQuery.each(html.rows, function(i, val) {
barChartData_102.labels.push(html.label[i]); pieData_103.datasets[0].data.push(val.value);
barChartData_102.datasets[0].data.push(html.target[i]); pieData_103.datasets[0].backgroundColor.push("#"+val.color);
barChartData_102.datasets[1].data.push(html.realisasi[i]); pieData_103.labels.push(val.nama);
}
window.myBar_102 = new Chart(ctx_102, {
type: 'bar',
data: barChartData_102,
options: barLineOptions
}); });
window.myPie_103 = new Chart(ctx_103, {
type: 'pie',
} data: pieData_103,
}, options:pieOptions
});
} //end if
}, //end success
beforeSend: function () { beforeSend: function () {
} }
}); });
}); });
</script>
</div> </script>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="col-md-12">
<div id="chart-line-103" >
<div class="row">
<center>
<div class="row">
<div class="col-md-12 table-title" style="border-right: 2px solid #000000;">
KOMPOSISI REALISASI PENDAPATAN
</div>
</div>
<div class="row">
<div class="col-md-10 col-md-offset-1">
<canvas id="canvas_103"></canvas>
</div>
</div>
</center>
</div> </div>
<script>
var pieData_103 = {
datasets: [{
data: [],
backgroundColor: []
}],
labels: [],
}
$(function(){
var ctx_103 = document.getElementById("canvas_103").getContext("2d");
var npie = 0 ;
$.ajax({
type: "POST",
url: "/eis/sipkd/grafik/pie/act",
data: "id=103",
success: function (html) {
if (html.success == true) {
jQuery.each(html.rows, function(i, val) {
pieData_103.datasets[0].data.push(val.value);
pieData_103.datasets[0].backgroundColor.push("#"+val.color);
pieData_103.labels.push(val.nama);
});
window.myPie_103 = new Chart(ctx_103, {
type: 'pie',
data: pieData_103,
options:pieOptions
});
} //end if
}, //end success
beforeSend: function () {
}
});
});
</script>
</div> </div>
</div> </div>
</div> <div class="col-md-6">
<div class="col-md-6"> <div class="col-md-12">
<div class="col-md-12"> <div id="chart-line-104" >
<div id="chart-line-104" > <div class="row">
<div class="row"> <center>
<center> <div class="row">
<div class="row"> <div class="col-md-12 table-title">
<div class="col-md-12 table-title"> KOMPOSISI REALISASI BELANJA
KOMPOSISI REALISASI BELANJA </div>
</div> </div>
</div> <div class="row">
<div class="row"> <div class="col-md-9 col-md-offset-1">
<div class="col-md-10 col-md-offset-1"> <canvas id="canvas_104" ></canvas>
<canvas id="canvas_104" ></canvas> </div>
</div> </div>
</div> </center>
</center> <script>
<script> var pieData_104 = {
var pieData_104 = { datasets: [{
datasets: [{ data: [],
data: [], backgroundColor: []
backgroundColor: [] }],
}], labels: [],
labels: [], }
}
$(function(){
/*GET DATA PIE*/
var ctx_104 = document.getElementById("canvas_104").getContext("2d");
//window.myPie_103 = new Chart(ctx_103).Pie(pieData_103);
var npie = 0 ; $(function(){
//GET DATA FROM SERVER /*GET DATA PIE*/
$.ajax({ var ctx_104 = document.getElementById("canvas_104").getContext("2d");
type: "POST", //window.myPie_103 = new Chart(ctx_103).Pie(pieData_103);
url: "/eis/sipkd/grafik/pie/act",
data: "id=104", var npie = 0 ;
success: function (html) { //GET DATA FROM SERVER
if (html.success == true) { $.ajax({
jQuery.each(html.rows, function(i, val) { type: "POST",
pieData_104.datasets[0].data.push(val.value); url: "/eis/sipkd/grafik/pie/act",
pieData_104.datasets[0].backgroundColor.push("#"+val.color); data: "id=104",
pieData_104.labels.push(val.nama); success: function (html) {
}); if (html.success == true) {
window.myPie_104 = new Chart(ctx_104, { jQuery.each(html.rows, function(i, val) {
type: 'pie', pieData_104.datasets[0].data.push(val.value);
data: pieData_104, pieData_104.datasets[0].backgroundColor.push("#"+val.color);
options: pieOptions, pieData_104.labels.push(val.nama);
}); });
window.myPie_104 = new Chart(ctx_104, {
type: 'pie',
data: pieData_104,
options: pieOptions,
});
}
},
beforeSend: function () {
} }
}, });
beforeSend: function () { });
}
}); </script>
}); </div>
</div>
</script> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div> </div>
</div> </div>
</div> </div>
</html> </html>
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!