Skip to content

aa.gusti / eis

Go to a project
Commit 6308deec by Eka Vivia Rizkiani (Solo)
Options

perubahan pada gauge

1 parent d3626d7a
Inline Side-by-side
Showing 1 changed file with 55 additions and 12 deletions
eispajak/views/templates/realtime_realisasi.pt
...@@ -7,6 +7,12 @@ ...@@ -7,6 +7,12 @@
<link href="${home}/eis/static/css/pcpd.css" rel="stylesheet"> <link href="${home}/eis/static/css/pcpd.css" rel="stylesheet">
</metal:css> </metal:css>
<style metal:fill-slot="styles"> <style metal:fill-slot="styles">
#chart-container text {
fill: #000000 !important;
}
#chart-container .fusioncharts-tick-labels text {
fill: #000000 !important;
}
</style> </style>
<div metal:fill-slot="content"> <div metal:fill-slot="content">
...@@ -137,17 +143,17 @@ ...@@ -137,17 +143,17 @@
</div> </div>
<!-- Gauge Chart Section --> <!-- Gauge Chart Section -->
<div class="col-md-4"> <div class="col-md-4">
<div class="panel panel-default" id="gaugePanel" style="min-height: 500px; background-color: rgba(139, 0, 0, 0.8);"> <div class="panel panel-default" id="gaugePanel" style="min-height: 500px; background-color: rgba(220, 220, 220, 0.2);">
<div class="panel-heading" style="padding: 10px 15px; background-color: rgba(139, 0, 0, 0.9); border-bottom: 1px solid rgba(139, 0, 0, 1);"> <div class="panel-heading" style="padding: 10px 15px; background-color: rgba(220, 220, 220, 0.25); border-bottom: 1px solid rgba(180, 180, 180, 0.4);">
<h5 class="text-center bold" style="margin: 0;border:1px solid; color: #FFFFFF;">REALISASI PAJAK DAERAH</h5> <h5 class="text-center bold" style="margin: 0;border:1px solid; color: #333;">REALISASI PAJAK DAERAH</h5>
<h3 style="color: #FFFFFF;"><b>Realisasi: Rp.<span id="gaugeRealisasi">0</span></b></h3> <h3 style="color: #333;"><b>Realisasi: Rp.<span id="gaugeRealisasi">0</span></b></h3>
</div> </div>
<div class="panel-body" style="padding: 0; height: calc(85% - 50px); overflow: hidden; display: flex; flex-direction: column; background-color: rgba(139, 0, 0, 0.7);"> <div class="panel-body" style="padding: 0; height: calc(85% - 50px); overflow: hidden; display: flex; flex-direction: column; background-color: rgba(220, 220, 220, 0.15);">
<div id="chart-container" style="flex:1; display:flex; align-items:center; justify-content:center; margin:0; padding:0; max-height:380px; min-height:350px; background-color:#2d2d2d; border-radius:8px;"> <div id="chart-container" style="flex:1; display:flex; align-items:center; justify-content:center; margin:0; padding:0; max-height:380px; min-height:350px; background-color:#C8C8C8; border-radius:8px;">
</div> </div>
<h4 id="gaugePercentage" class="text-center" style="color: #333; font-size: 16px; display: none;">40.99%</h4> <h4 id="gaugePercentage" class="text-center" style="color: #333; font-size: 16px; display: none;">40.99%</h4>
<div class="text-left" style="padding: 10px; background: rgba(139, 0, 0, 0.8); border-top: 1px solid rgba(139, 0, 0, 1);"> <div class="text-left" style="padding: 10px; background: rgba(220, 220, 220, 0.2); border-top: 1px solid rgba(180, 180, 180, 0.4);">
<h3 style="color: #FFFFFF;"><b>Target: Rp.<span id="gaugeTarget">3.679.068.431.493</span></b></h3> <h3 style="color: #333;"><b>Target: Rp.<span id="gaugeTarget">3.679.068.431.493</span></b></h3>
</div> </div>
</div> </div>
</div> </div>
...@@ -421,12 +427,18 @@ ...@@ -421,12 +427,18 @@
gaugeendangle: "-45", gaugeendangle: "-45",
showvalue: "1", showvalue: "1",
valuefontsize: "36", valuefontsize: "36",
valuefontcolor: "#FFFFFF", valuefontcolor: "#000000",
valuefontbold: "1", valuefontbold: "1",
numberSuffix: "%",
majortmnumber: "8", majortmnumber: "8",
majortmthickness: "3", majortmthickness: "3",
majortmheight: "15", majortmheight: "15",
majortmcolor: "#000000", majortmcolor: "#000000",
tickvaluecolor: "#000000",
tickvaluefontsize: "12",
labelcolor: "#000000",
labelfontsize: "12",
labelfont: "Arial",
minortmheight: "8", minortmheight: "8",
minortmthickness: "1", minortmthickness: "1",
minortmnumber: "1", minortmnumber: "1",
...@@ -434,15 +446,46 @@ ...@@ -434,15 +446,46 @@
showgaugeborder: "1", showgaugeborder: "1",
gaugebordercolor: "#555555", gaugebordercolor: "#555555",
gaugeborderthickness: "2", gaugeborderthickness: "2",
showticklabels: "1",
showlimits: "1",
theme: "candy", theme: "candy",
bgcolor: "#2d2d2d", bgcolor: "#C8C8C8",
canvasbgcolor: "#2d2d2d", canvasbgcolor: "#C8C8C8",
gaugefillmix: "{dark-10},{light-10},{dark-10}", gaugefillmix: "{dark-10},{light-10},{dark-10}",
gaugefillratio: "15,80,5", gaugefillratio: "15,80,5",
showlicense: "0", showlicense: "0",
showlogo: "0", showlogo: "0",
creditlabel: "0" creditlabel: "0"
}, },
styles: {
definition: [
{
name: "TickValueStyle",
type: "font",
font: "Arial",
size: "12",
color: "#000000",
bold: "0"
},
{
name: "ScaleLabelStyle",
type: "font",
font: "Arial",
size: "12",
color: "#000000"
}
],
application: [
{
toobject: "TickValues",
styles: "TickValueStyle"
},
{
toobject: "ScaleValues",
styles: "ScaleLabelStyle"
}
]
},
colorrange: { colorrange: {
color: [ color: [
{ minvalue: "0", maxvalue: "75", code: "#888888" }, { minvalue: "0", maxvalue: "75", code: "#888888" },
...@@ -472,7 +515,7 @@ ...@@ -472,7 +515,7 @@
x: "$gaugeCenterX", x: "$gaugeCenterX",
y: "$gaugeCenterY + 50", y: "$gaugeCenterY + 50",
fontsize: "18", fontsize: "18",
color: "#FFFFFF", color: "#000000",
font: "Arial", font: "Arial",
bold: "1" bold: "1"
} }
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!