de novo eu aqui
This commit is contained in:
anon
parent
b18c65520d
commit
2e886b15d4
40 changed files with 1381 additions and 4232 deletions
|
|
@ -9,82 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Miner Fees (Fees excluded new coins, Native Units)
|
||||
</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Miner Fees (Fees excluded new coins, Native Units)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
XMR Miner Fees (XMR)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
BTC Miner Fees (BTC)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_btc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -236,11 +183,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -290,11 +237,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -321,11 +268,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Miner Revenue (Dollars / day)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Miner Revenue (Dollars / day)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Daily XMR Miner Revenue</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_xmr }} / day</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Daily BTC Miner Revenue</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_btc }} / day</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -235,11 +183,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -289,11 +237,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -320,11 +268,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,82 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Annualized Miner Revenue / Marketcap (Fees plus new coins,
|
||||
percentage)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Annualized Miner Revenue / Marketcap (Fees plus new coins, percentage)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
XMR Miner Revenue (%)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
BTC Miner Revenue (%)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_btc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -233,15 +180,14 @@
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2008-11-14', '2024-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -287,15 +233,14 @@
|
|||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
,range: ['2008-11-14', '2024-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -322,11 +267,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,82 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Daily Miner Revenue (Fees plus new coins, Native Units / day)
|
||||
</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Daily Miner Revenue (Fees plus new coins, Native Units / day)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
XMR Miner Revenue </div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_xmr }} XMR / day</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
BTC Miner Revenue (BTC)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_btc }} BTC / day</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -237,11 +184,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -291,11 +238,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -322,11 +269,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Monero's Dominance Over Other 'Privacy' Coins (%)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Monero's Dominance Over Other 'Privacy' Coins (%)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Dominance</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_dominance }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Dominance</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ top_dominance }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -210,10 +158,10 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 120,
|
||||
b: 35,
|
||||
t: 10,
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
|
@ -264,10 +212,10 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 100,
|
||||
b: 35,
|
||||
t: 10,
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
|
@ -295,11 +243,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,414 +0,0 @@
|
|||
{% extends 'charts/base.html' %}
|
||||
|
||||
{% block header %}
|
||||
<title>Moneroj.net - Price</title>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Price (log scale, USD)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Last Price (USD)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_price }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Stock-to-flow Price (USD)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_sf }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Price To Date (USD)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Annual Inflation (%)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_inflation }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="id_Modal" tabindex="-1" role="dialog" aria-labelledby="Modal" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="Modal">Help about the chart</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Cancelar">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
This chart shows the price of the coin on a log scale. The color of the points indicate their position
|
||||
on the Bitcoin pair, being red as overbought and blue as cheap.<br>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Fim do Modal -->
|
||||
|
||||
<!-- Page level plugins -->
|
||||
<script>
|
||||
|
||||
var data4 = {
|
||||
type: "scatter",
|
||||
mode: "markers",
|
||||
name: 'Average price on date',
|
||||
x: {{ dates|safe }},
|
||||
y: {{ values|safe }},
|
||||
line: {color: '#7f421d'},
|
||||
marker: {
|
||||
color: {{ color|safe }},
|
||||
colorbar: {
|
||||
title: {
|
||||
text: 'Cycle on the Bitcoin pair (%)',
|
||||
side: 'right'
|
||||
,font: {
|
||||
color: 'white'
|
||||
,size: 14
|
||||
}
|
||||
}
|
||||
,thickness: 10
|
||||
,tickfont: {
|
||||
color: 'white'
|
||||
,size: 14
|
||||
}
|
||||
,borderwidth: 0
|
||||
},
|
||||
colorscale: [['0', '#0000ff'], ['0.33', '#00ff00'], ['0.66', '#ffff00'], ['1', '#ff0000']],
|
||||
sizemode: 'area',
|
||||
size: 5,
|
||||
cmax: 100,
|
||||
cmin: 0
|
||||
}
|
||||
};
|
||||
|
||||
var data4_mobile = {
|
||||
type: "scatter",
|
||||
mode: "markers",
|
||||
name: 'Average price on date',
|
||||
x: {{ dates|safe }},
|
||||
y: {{ values|safe }},
|
||||
line: {color: '#7f421d'},
|
||||
marker: {
|
||||
color: {{ color|safe }},
|
||||
colorbar: {
|
||||
thickness: 4
|
||||
,tickfont: {
|
||||
color: 'white'
|
||||
,size: 6
|
||||
}
|
||||
,borderwidth: 0
|
||||
},
|
||||
colorscale: [['0', '#0000ff'], ['0.33', '#00ff00'], ['0.66', '#ffff00'], ['1', '#ff0000']],
|
||||
sizemode: 'area',
|
||||
size: 3,
|
||||
cmax: 100,
|
||||
cmin: 0
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
var data3 = {
|
||||
type: "scatter",
|
||||
mode: "lines",
|
||||
name: 'Resistance',
|
||||
x: {{ dates|safe }},
|
||||
y: {{ average2|safe }},
|
||||
line: {
|
||||
color: '#662222'
|
||||
,width: 3
|
||||
}
|
||||
};
|
||||
|
||||
var data3_mobile = {
|
||||
type: "scatter",
|
||||
mode: "lines",
|
||||
name: 'Resistance',
|
||||
x: {{ dates|safe }},
|
||||
y: {{ average2|safe }},
|
||||
line: {
|
||||
color: '#662222'
|
||||
,width: 3
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
var data2 = {
|
||||
type: "scatter",
|
||||
mode: "lines",
|
||||
name: 'Buy line',
|
||||
x: {{ dates|safe }},
|
||||
y: {{ average1|safe }},
|
||||
line: {
|
||||
color: '#225522'
|
||||
,width: 3
|
||||
}
|
||||
};
|
||||
|
||||
var data2_mobile = {
|
||||
type: "scatter",
|
||||
mode: "lines",
|
||||
name: 'Buy line',
|
||||
x: {{ dates|safe }},
|
||||
y: {{ average1|safe }},
|
||||
line: {
|
||||
color: '#225522'
|
||||
,width: 3
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
var data = [data3, data4, data2];
|
||||
var data_mobile = [data4_mobile, data2_mobile, data3_mobile];
|
||||
|
||||
var layout = {
|
||||
plot_bgcolor:"#252221",
|
||||
paper_bgcolor:"#252221",
|
||||
annotations: [
|
||||
{
|
||||
xref: 'paper',
|
||||
yref: 'paper',
|
||||
x: 0.98,
|
||||
xanchor: 'auto',
|
||||
y: 0.05,
|
||||
yanchor: 'auto',
|
||||
text: 'Moneroj<br>https://www.moneroj.net',
|
||||
showarrow: false,
|
||||
borderwidth: 1,
|
||||
bordercolor: '#5f5f5f',
|
||||
bgcolor: '#333333',
|
||||
borderpad: 5,
|
||||
align: 'center',
|
||||
font: {
|
||||
color: "white",
|
||||
size: 12
|
||||
}
|
||||
}],
|
||||
separators: ",.",
|
||||
legend: {
|
||||
x: 0.80,
|
||||
y: 0.05,
|
||||
bgcolor: '#333333',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
font: {
|
||||
color: 'white',
|
||||
size: 12
|
||||
},
|
||||
traceorder: 'normal',
|
||||
xanchor: 'auto',
|
||||
yanchor: 'auto'
|
||||
},
|
||||
hoverlabel: {
|
||||
namelength: -1
|
||||
},
|
||||
yaxis: {
|
||||
type: "log",
|
||||
title: {
|
||||
text: 'USD',
|
||||
font: {
|
||||
size: 20,
|
||||
color: 'white'
|
||||
}
|
||||
},
|
||||
tickformat :",.2f"
|
||||
,nticks: 10
|
||||
,tickfont: {
|
||||
color: "#ffffff"
|
||||
,size: 12
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
},
|
||||
xaxis: {
|
||||
hoverformat: "%Y-%m-%d",
|
||||
showgrid: true,
|
||||
type: 'date',
|
||||
nticks: 10
|
||||
,tickfont: {
|
||||
color: "#dddddd"
|
||||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-05-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
plot_bgcolor:"black",
|
||||
paper_bgcolor:"black",
|
||||
separators: ",.",
|
||||
hoverlabel: {
|
||||
namelength: -1
|
||||
},
|
||||
legend: {
|
||||
x: 0.98,
|
||||
y: 0.05,
|
||||
bgcolor: '#000000',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
font: {
|
||||
color: 'white',
|
||||
size: 5
|
||||
},
|
||||
traceorder: 'normal',
|
||||
xanchor: 'auto',
|
||||
yanchor: 'auto'
|
||||
},
|
||||
showlegend: false,
|
||||
yaxis: {
|
||||
type: "log",
|
||||
tickformat :",.0f"
|
||||
,nticks: 10
|
||||
,tickfont: {
|
||||
color: "#ffffff"
|
||||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
},
|
||||
xaxis: {
|
||||
hoverformat: "%Y",
|
||||
showgrid: true,
|
||||
type: 'date',
|
||||
nticks: 10
|
||||
,tickfont: {
|
||||
color: "#dddddd"
|
||||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
,range: ['2009-12-20', '2026-01-10']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
||||
|
||||
let el = document.createElement('div');
|
||||
document.body.appendChild(el);
|
||||
|
||||
let curEnv = envs.shift();
|
||||
|
||||
for (let env of envs.reverse()) {
|
||||
el.classList.add(`d-${env}-none`);
|
||||
|
||||
if (window.getComputedStyle(el).display === 'none') {
|
||||
curEnv = env;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
document.body.removeChild(el);
|
||||
return curEnv;
|
||||
|
||||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
|
|
@ -9,56 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Total Pageviews and Unique Visitors (Moneroj.net, linear)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Total Pageviews and Unique Visitors (Moneroj.net, linear)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -162,8 +135,8 @@ var layout = {
|
|||
}],
|
||||
separators: ",.",
|
||||
legend: {
|
||||
x: 0.98,
|
||||
y: 0.50,
|
||||
x: 0.02,
|
||||
y: 0.98,
|
||||
bgcolor: '#333333',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
|
|
@ -207,13 +180,13 @@ var layout = {
|
|||
,gridcolor: "#333333"
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 80,
|
||||
r: 30,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 10
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -261,13 +234,13 @@ var layout_mobile = {
|
|||
,range: ['2022-07-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 100,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 10
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -293,11 +266,9 @@ var layout_mobile = {
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Transaction Percentage (XMR's tx / BTC's tx)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Transaction Percentage (XMR's tx / BTC's tx)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Percentage</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_transactions }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Percentage</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -211,11 +159,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -265,11 +213,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -296,11 +244,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,85 +9,34 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Monthly Percentage (XMR's tx / BTC's tx)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Monthly Percentage (XMR's tx / BTC's tx)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Card -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Monthly Percentage</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_transactions }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Card -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Percentage of Transactions</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="id_Modal" tabindex="-1" role="dialog" aria-labelledby="Modal" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
|
|
@ -225,16 +174,15 @@
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-05-01', '2023-06-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -279,16 +227,15 @@
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-05-01', '2023-06-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -314,11 +261,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,101 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Power Law</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Power Law
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Last Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_price }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Stock-to-flow Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_sf }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Daily Close</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Annual Inflation</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_inflation }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -349,13 +277,13 @@ var layout = {
|
|||
,size: 13
|
||||
},
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 60,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -410,13 +338,13 @@ var layout_mobile = {
|
|||
,size: 13
|
||||
},
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -442,11 +370,9 @@ function findBootstrapEnvironment() {
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,101 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Price (linear scale, USD)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Price (linear scale, USD)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Last Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_price }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Stock-to-flow Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_sf }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Daily Close</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Annual Inflation</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_inflation }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -263,16 +191,15 @@ var layout = {
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-05-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -317,16 +244,15 @@ var layout_mobile = {
|
|||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
,range: ['2009-12-20', '2026-01-10']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -352,11 +278,9 @@ function findBootstrapEnvironment() {
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,101 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Price (log scale, USD)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Price (log scale, USD)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Last Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_price }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Stock-to-flow Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_sf }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Daily Close</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Annual Inflation</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_inflation }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -119,8 +47,8 @@
|
|||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
This chart shows the price of the coin on a log scale. The color of the points indicate their position
|
||||
on the Bitcoin pair, being red as overbought and blue as cheap.<br>
|
||||
This chart shows the price of the coin on a linear scale. The color of the points indicate their
|
||||
position on the Bitcoin pair, being red as overbought and blue as cheap.<br>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
|
|
@ -131,9 +59,9 @@
|
|||
<!-- Fim do Modal -->
|
||||
|
||||
|
||||
|
||||
<!-- Page level plugins -->
|
||||
<script>
|
||||
|
||||
var data4 = {
|
||||
type: "scatter",
|
||||
mode: "markers",
|
||||
|
|
@ -202,7 +130,7 @@ var layout = {
|
|||
{
|
||||
xref: 'paper',
|
||||
yref: 'paper',
|
||||
x: 0.50,
|
||||
x: 0.98,
|
||||
xanchor: 'auto',
|
||||
y: 0.02,
|
||||
yanchor: 'auto',
|
||||
|
|
@ -263,16 +191,15 @@ var layout = {
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-05-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -317,16 +244,15 @@ var layout_mobile = {
|
|||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
,range: ['2009-12-20', '2026-01-10']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -352,11 +278,9 @@ function findBootstrapEnvironment() {
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -5,95 +5,32 @@
|
|||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Price (BTC)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Price (BTC)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Last Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_price }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Bottom</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ bottom }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Last Top</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -310,11 +247,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -341,11 +278,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -5,95 +5,32 @@
|
|||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Price (BTC)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Price (BTC)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Last Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_price }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Bottom</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ bottom }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Last Top</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -310,11 +247,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -341,11 +278,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,100 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Total Dominance of Privacy Coins Over the Cryptocurrency Market (%)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Total Dominance of Privacy Coins Over the Cryptocurrency Market (%)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Latest Privacy Marketcap</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_marketcap }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Privacy Marketcap</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ top_marketcap }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Latest Privacy Dominance</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_dominance }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Top Privacy Dominance</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ top_dominance }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -248,11 +177,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -302,11 +231,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -333,11 +262,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,100 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Total Marketcap of Privacy Coins (USD)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Total Marketcap of Privacy Coins (USD)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Latest Privacy Marketcap</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_marketcap }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Privacy Marketcap</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ top_marketcap }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Latest Privacy Dominance</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_dominance }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-3 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Top Privacy Dominance</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ top_dominance }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -250,15 +179,15 @@
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-04-14', '2024-01-01']
|
||||
,range: ['2014-04-14', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -304,15 +233,15 @@
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-04-14', '2024-01-01']
|
||||
,range: ['2014-04-14', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -339,11 +268,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Monero's Coinmarketcap Rank</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Monero's Coinmarketcap Rank
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Rank</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_value }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Rank</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -255,13 +203,13 @@ var layout = {
|
|||
,range: ['2014-05-01', '2023-08-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 120,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 10
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -320,13 +268,13 @@ var layout_mobile = {
|
|||
,range: ['2014-05-01', '2023-08-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 100,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 10
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -352,11 +300,9 @@ function findBootstrapEnvironment() {
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Security Budget for Monero and Bitcoin (Dollars/second)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Security Budget for Monero and Bitcoin (Dollars/second)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Monero Security Budget</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_xmr }} / second</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Bitcoin Security Budget</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_btc }} / second</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -174,7 +122,7 @@
|
|||
yref: 'paper',
|
||||
x: 1,
|
||||
xanchor: 'auto',
|
||||
y: 0.6,
|
||||
y: 0.25,
|
||||
yanchor: 'auto',
|
||||
text: 'Moneroj<br>https://www.moneroj.net',
|
||||
showarrow: false,
|
||||
|
|
@ -191,7 +139,7 @@
|
|||
separators: ",.",
|
||||
legend: {
|
||||
x: 1,
|
||||
y: 0.95,
|
||||
y: 0.02,
|
||||
bgcolor: '#333333',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
|
|
@ -233,16 +181,16 @@
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2009-01-01', '2026-01-01']
|
||||
,range: ['2009-01-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -287,16 +235,16 @@
|
|||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
,range: ['2009-01-01', '2026-01-01']
|
||||
,range: ['2009-01-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -322,11 +270,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,99 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12">
|
||||
<div class="alert alert-danger" role="alert">
|
||||
Warning: the price described by the gray line is just a suggestion of future behavior based on
|
||||
past price-action pattern (adjusted for variable inflation).
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Stock-to-flow Model
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Stock-to-flow Model (log scale)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Last Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_price }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Stock-to-flow Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_sf }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Annual Inflation</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_inflation }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -314,13 +244,13 @@ var layout = {
|
|||
,range: ['2014-05-01', '2023-07-31']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -368,13 +298,13 @@ var layout_mobile = {
|
|||
,range: ['2014-05-01', '2023-07-31']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -400,11 +330,9 @@ function findBootstrapEnvironment() {
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,91 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Stock-to-flow Model (linear scale)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Stock-to-flow Model
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Last Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_price }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Stock-to-flow Price</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_sf }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Annual Inflation</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_inflation }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -111,7 +49,7 @@
|
|||
<div class="modal-body">
|
||||
This chart shows the price of the coin on each date, coloring the points indicating their position on
|
||||
the Bitcoin pair, being red as overbought and blue as cheap.
|
||||
This chart is plotted on a log scale. The formula is Stocktoflow = (100/Inflation)^Multiplier,
|
||||
This chart is plotted on a linear scale. The formula is Stocktoflow = (100/Inflation)^Multiplier,
|
||||
Multiplier is 1.65 for Monero (it's higher for Bitcoin's stock-to-flow
|
||||
model, for example).<br>
|
||||
</div>
|
||||
|
|
@ -279,16 +217,16 @@ var layout = {
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-05-01', '2023-01-01']
|
||||
,range: ['2014-05-01', '2023-07-31']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -333,16 +271,16 @@ var layout_mobile = {
|
|||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
,range: ['2014-05-01', '2023-01-01']
|
||||
,range: ['2014-05-01', '2023-07-31']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -368,11 +306,9 @@ function findBootstrapEnvironment() {
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,80 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Stock-to-flow Multiple (Price / SF Model)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Stock-to-flow Multiple (Price / SF Model)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Stock-to-flow Multiple</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_sf }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Top Stock-to-flow Multiple Last Cycle</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -295,13 +244,13 @@ var layout = {
|
|||
,range: ['2014-02-01', '2023-06-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -349,13 +298,13 @@ var layout_mobile = {
|
|||
,range: ['2014-02-01', '2023-06-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -381,11 +330,9 @@ function findBootstrapEnvironment() {
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,54 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Sharpe Ratio</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Sharpe Ratio
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -161,7 +136,7 @@
|
|||
yref: 'paper',
|
||||
x: 0.02,
|
||||
xanchor: 'auto',
|
||||
y: 0.50,
|
||||
y: 0.85,
|
||||
yanchor: 'auto',
|
||||
text: 'Moneroj<br>https://www.moneroj.net',
|
||||
showarrow: false,
|
||||
|
|
@ -243,10 +218,10 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 120,
|
||||
b: 35,
|
||||
t: 10,
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
|
@ -308,10 +283,10 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 100,
|
||||
b: 35,
|
||||
t: 10,
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
|
@ -339,11 +314,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="800px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Shielded Transactions</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Shielded Transactions
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Card -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Monero Monthly Transactions</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ monthly }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Card -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Monero Dominance</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ dominance }}%</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -314,13 +262,13 @@ var data1 = {
|
|||
,gridcolor: "#333333"
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -367,13 +315,13 @@ var data1 = {
|
|||
,gridcolor: "#333333"
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -399,11 +347,9 @@ var data1 = {
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,100 +9,45 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Total Number of Reddit Subscribers for Bitcoin and CryptoCurrency
|
||||
</h6>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Total Number of Reddit Subscribers for Bitcoin and CryptoCurrency
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph_2">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Total Number of Reddit Subscribers for Monero</h6>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph2" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph_2" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Total Number of Reddit Subscribers for Monero
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph2" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Monero Subscribers</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Bitcoin Subscribers</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_btc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
CryptoCurrency Subscribers</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_crypto }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -368,14 +313,10 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
document.getElementById("graph_2").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
document.getElementById("graph_2").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Marketcap Divided by Number of Reddit Subscribers</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Marketcap Divided by Number of Reddit Subscribers
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Marketcap / Redditors for Monero</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Marketcap / Redditors for Bitcoin</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_btc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -237,11 +185,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -291,11 +239,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -322,11 +270,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,90 +9,45 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Reddit Subscribers of /CryptoCurrency as a Percentage of /Bitcoin
|
||||
</h6>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Reddit Subscribers of /CryptoCurrency as a Percentage of /Bitcoin
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph12">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Reddit Subscribers of /Monero as a Percentage of /Bitcoin</h6>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph2" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph_2" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Reddit Subscribers of /Monero as a Percentage of /Bitcoin
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph2" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Monero Subscribers</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-64 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current CryptoCurrency Subscribers</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_crypto }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -123,10 +78,10 @@
|
|||
</div>
|
||||
<!-- Fim do Modal -->
|
||||
|
||||
|
||||
<!-- Page level plugins -->
|
||||
<script>
|
||||
var data1 = {
|
||||
|
||||
var data1 = {
|
||||
type: "scatter",
|
||||
mode: "lines",
|
||||
name: '/Monero as % of /Bitcoin',
|
||||
|
|
@ -179,177 +134,171 @@
|
|||
var data_mobile = [data2_mobile];
|
||||
var data_2 = [data1];
|
||||
var data_mobile_2 = [data1_mobile];
|
||||
|
||||
var layout = {
|
||||
plot_bgcolor:"#252221",
|
||||
paper_bgcolor:"#252221",
|
||||
annotations: [
|
||||
{
|
||||
xref: 'paper',
|
||||
yref: 'paper',
|
||||
x: 1,
|
||||
xanchor: 'auto',
|
||||
y: 0.05,
|
||||
yanchor: 'auto',
|
||||
text: 'Moneroj<br>https://www.moneroj.net',
|
||||
showarrow: false,
|
||||
borderwidth: 1,
|
||||
bordercolor: '#5f5f5f',
|
||||
bgcolor: '#333333',
|
||||
borderpad: 5,
|
||||
align: 'center',
|
||||
font: {
|
||||
color: "white",
|
||||
size: 12
|
||||
}
|
||||
}],
|
||||
separators: ",.",
|
||||
legend: {
|
||||
x: 1,
|
||||
y: 0.85,
|
||||
bgcolor: '#333333',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
font: {
|
||||
color: 'white',
|
||||
size: 12
|
||||
},
|
||||
traceorder: 'normal',
|
||||
xanchor: 'auto',
|
||||
yanchor: 'auto'
|
||||
},
|
||||
hoverlabel: {
|
||||
namelength: -1
|
||||
},
|
||||
yaxis: {
|
||||
type: "linear",
|
||||
title: {
|
||||
text: 'Subscribers Percentage',
|
||||
var layout = {
|
||||
plot_bgcolor:"#252221",
|
||||
paper_bgcolor:"#252221",
|
||||
annotations: [
|
||||
{
|
||||
xref: 'paper',
|
||||
yref: 'paper',
|
||||
x: 1,
|
||||
xanchor: 'auto',
|
||||
y: 0.05,
|
||||
yanchor: 'auto',
|
||||
text: 'Moneroj<br>https://www.moneroj.net',
|
||||
showarrow: false,
|
||||
borderwidth: 1,
|
||||
bordercolor: '#5f5f5f',
|
||||
bgcolor: '#333333',
|
||||
borderpad: 5,
|
||||
align: 'center',
|
||||
font: {
|
||||
size: 20,
|
||||
color: 'white'
|
||||
color: "white",
|
||||
size: 12
|
||||
}
|
||||
}],
|
||||
separators: ",.",
|
||||
legend: {
|
||||
x: 1,
|
||||
y: 0.40,
|
||||
bgcolor: '#333333',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
font: {
|
||||
color: 'white',
|
||||
size: 12
|
||||
},
|
||||
traceorder: 'normal',
|
||||
xanchor: 'auto',
|
||||
yanchor: 'auto'
|
||||
},
|
||||
tickformat :",.1f"
|
||||
,nticks: 10
|
||||
,tickfont: {
|
||||
color: "#ffffff"
|
||||
,size: 12
|
||||
hoverlabel: {
|
||||
namelength: -1
|
||||
},
|
||||
yaxis: {
|
||||
type: "linear",
|
||||
title: {
|
||||
text: 'Percentage',
|
||||
font: {
|
||||
size: 20,
|
||||
color: 'white'
|
||||
}
|
||||
},
|
||||
tickformat :",.1f"
|
||||
,nticks: 10
|
||||
,tickfont: {
|
||||
color: "#ffffff"
|
||||
,size: 12
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
},
|
||||
xaxis: {
|
||||
hoverformat: "%Y-%m-%d",
|
||||
showgrid: true,
|
||||
type: 'date',
|
||||
nticks: 10
|
||||
,tickfont: {
|
||||
color: "#dddddd"
|
||||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-10-01', '2023-06-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
},
|
||||
xaxis: {
|
||||
hoverformat: "%Y-%m-%d",
|
||||
showgrid: true,
|
||||
type: 'date',
|
||||
nticks: 10
|
||||
,tickfont: {
|
||||
color: "#dddddd"
|
||||
,size: 13
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
plot_bgcolor:"black",
|
||||
paper_bgcolor:"black",
|
||||
separators: ",.",
|
||||
hoverlabel: {
|
||||
namelength: -1
|
||||
},
|
||||
legend: {
|
||||
x: 0.98,
|
||||
y: 0.05,
|
||||
bgcolor: '#000000',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
font: {
|
||||
color: 'white',
|
||||
size: 5
|
||||
},
|
||||
traceorder: 'normal',
|
||||
xanchor: 'auto',
|
||||
yanchor: 'auto'
|
||||
},
|
||||
showlegend: false,
|
||||
yaxis: {
|
||||
type: "linear",
|
||||
tickformat :",.0f"
|
||||
,nticks: 10
|
||||
,tickfont: {
|
||||
color: "#ffffff"
|
||||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
},
|
||||
xaxis: {
|
||||
hoverformat: "%Y",
|
||||
showgrid: true,
|
||||
type: 'date',
|
||||
nticks: 10
|
||||
,tickfont: {
|
||||
color: "#dddddd"
|
||||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
,range: ['2014-10-01', '2023-06-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-05-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
||||
|
||||
let el = document.createElement('div');
|
||||
document.body.appendChild(el);
|
||||
|
||||
let curEnv = envs.shift();
|
||||
|
||||
for (let env of envs.reverse()) {
|
||||
el.classList.add(`d-${env}-none`);
|
||||
|
||||
if (window.getComputedStyle(el).display === 'none') {
|
||||
curEnv = env;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
document.body.removeChild(el);
|
||||
return curEnv;
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
plot_bgcolor:"black",
|
||||
paper_bgcolor:"black",
|
||||
separators: ",.",
|
||||
hoverlabel: {
|
||||
namelength: -1
|
||||
},
|
||||
legend: {
|
||||
x: 0.98,
|
||||
y: 0.05,
|
||||
bgcolor: '#000000',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
font: {
|
||||
color: 'white',
|
||||
size: 5
|
||||
},
|
||||
traceorder: 'normal',
|
||||
xanchor: 'auto',
|
||||
yanchor: 'auto'
|
||||
},
|
||||
showlegend: false,
|
||||
yaxis: {
|
||||
type: "linear",
|
||||
tickformat :",.1f"
|
||||
,nticks: 10
|
||||
,tickfont: {
|
||||
color: "#ffffff"
|
||||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
},
|
||||
xaxis: {
|
||||
hoverformat: "%Y",
|
||||
showgrid: false,
|
||||
type: 'date',
|
||||
nticks: 3
|
||||
,tickfont: {
|
||||
color: "#dddddd"
|
||||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
,range: ['2014-05-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
||||
|
||||
let el = document.createElement('div');
|
||||
document.body.appendChild(el);
|
||||
|
||||
let curEnv = envs.shift();
|
||||
|
||||
for (let env of envs.reverse()) {
|
||||
el.classList.add(`d-${env}-none`);
|
||||
|
||||
if (window.getComputedStyle(el).display === 'none') {
|
||||
curEnv = env;
|
||||
break;
|
||||
}
|
||||
else {
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
||||
document.body.removeChild(el);
|
||||
return curEnv;
|
||||
{% endblock %}
|
||||
|
||||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
|
||||
document.getElementById("graph12").style.height="350px";
|
||||
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="750px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
|
||||
document.getElementById("graph12").style.height="750px";
|
||||
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
|
|
@ -9,100 +9,45 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">/Bitcoin, /CryptoCurrency and /Monero Monthly New Subscribers
|
||||
</h6>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
/Bitcoin, /CryptoCurrency and /Monero Monthly New Subscribers
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph12">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">/Bitcoin, /CryptoCurrency and /Monero Monthly Percentage Increase
|
||||
in Subscribers</h6>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph2" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph_2" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
/Bitcoin, /CryptoCurrency and /Monero Monthly Percentage Increase
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph2" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
New Monero Subscribers (Last 30 days)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
New Bitcoin Subscribers (Last 30 days)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_btc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
New CryptoCurrency Subscribers (Last 30 days)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_crypto }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -546,42 +491,37 @@
|
|||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
||||
function findBootstrapEnvironment() {
|
||||
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
||||
|
||||
let el = document.createElement('div');
|
||||
document.body.appendChild(el);
|
||||
let el = document.createElement('div');
|
||||
document.body.appendChild(el);
|
||||
|
||||
let curEnv = envs.shift();
|
||||
let curEnv = envs.shift();
|
||||
|
||||
for (let env of envs.reverse()) {
|
||||
el.classList.add(`d-${env}-none`);
|
||||
for (let env of envs.reverse()) {
|
||||
el.classList.add(`d-${env}-none`);
|
||||
|
||||
if (window.getComputedStyle(el).display === 'none') {
|
||||
curEnv = env;
|
||||
break;
|
||||
if (window.getComputedStyle(el).display === 'none') {
|
||||
curEnv = env;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
document.body.removeChild(el);
|
||||
return curEnv;
|
||||
|
||||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
||||
document.body.removeChild(el);
|
||||
return curEnv;
|
||||
{% endblock %}
|
||||
|
||||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
|
||||
document.getElementById("graph12").style.height="350px";
|
||||
Plotly.newPlot('graph2', data_mobile_2, layout_mobile_2, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
|
||||
document.getElementById("graph12").style.height="700px";
|
||||
Plotly.newPlot('graph2', data_2, layout_2, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
|
|
@ -9,80 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Total Number of Reddit Subscribers for Monero and Number of Transactions</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph2" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Total Number of Reddit Subscribers for Monero and Number of Transactions
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Monero Subscribers</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Daily Transactions</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_transactions }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph2" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -255,11 +204,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 120,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
l: 100,
|
||||
r: 100,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -320,11 +269,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 100,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -351,11 +300,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{% extends 'charts/base.html' %}
|
||||
|
||||
{% block header %}
|
||||
<title>Moneroj.net - Reddit Comments</title>
|
||||
<title>Moneroj.net - Reddit Subscribers</title>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
|
@ -9,100 +9,45 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Comments per day on Subreddits /Bitcoin and /CryptoCurrency
|
||||
</h6>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Comments per day on Subreddits /Bitcoin and /CryptoCurrency
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph_2">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Comments per day on Subreddit /Monero</h6>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph2" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph_2" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Comments per day on Subreddit /Monero
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph2" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Monero Daily Comments</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Bitcoin Daily Comments</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_btc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
CryptoCurrency Daily Comments</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_crypto }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -118,9 +63,13 @@
|
|||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
These charts show the total number of daily comments for Subreddits: Monero, CryptoCurrency and Bitcoin. The more
|
||||
users the subreddit has, more likely it is to
|
||||
achieve mass adoption.</div>
|
||||
These charts show the total number of users for subreddits /Monero ang /CryptoCurrency as a percentage
|
||||
of the total users of /Bitcoin subreddit.
|
||||
Sudden spikes in total percentage indicate there's a new wave of people getting into other
|
||||
cryptocurrencies, not only in Bitcoin. When /CryptoCurrency dominance increase,
|
||||
it makes sense to expect that such projects will appreciate against the BTC pair. However, this is just
|
||||
and idea to observe.
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
</div>
|
||||
|
|
@ -216,9 +165,9 @@
|
|||
{
|
||||
xref: 'paper',
|
||||
yref: 'paper',
|
||||
x: 1,
|
||||
x: 0.02,
|
||||
xanchor: 'auto',
|
||||
y: 0.05,
|
||||
y: 0.98,
|
||||
yanchor: 'auto',
|
||||
text: 'Moneroj<br>https://www.moneroj.net',
|
||||
showarrow: false,
|
||||
|
|
@ -234,8 +183,8 @@
|
|||
}],
|
||||
separators: ",.",
|
||||
legend: {
|
||||
x: 1,
|
||||
y: 0.40,
|
||||
x: 0.02,
|
||||
y: 0.80,
|
||||
bgcolor: '#333333',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
|
|
@ -297,8 +246,8 @@
|
|||
namelength: -1
|
||||
},
|
||||
legend: {
|
||||
x: 0.98,
|
||||
y: 0.05,
|
||||
x: 0.02,
|
||||
y: 0.98,
|
||||
bgcolor: '#000000',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
|
|
@ -343,6 +292,7 @@
|
|||
}
|
||||
};
|
||||
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
||||
|
||||
|
|
@ -366,17 +316,14 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
document.getElementById("graph_2").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
document.getElementById("graph_2").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{% extends 'charts/base.html' %}
|
||||
|
||||
{% block header %}
|
||||
<title>Moneroj.net - Reddit Posts</title>
|
||||
<title>Moneroj.net - Reddit Subscribers</title>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
|
@ -9,99 +9,45 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Posts per day on Subreddits /Bitcoin and /CryptoCurrency
|
||||
</h6>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Posts per day on Subreddits /Bitcoin and /CryptoCurrency
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph_2">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Posts per day on Reddit /Monero</h6>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph2" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph_2" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Posts per day on Reddit /Monero
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph2" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Monero Posts (24h)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Bitcoin Posts (24h)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_btc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-4 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
CryptoCurrency Posts (24h)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ last_crypto }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -117,9 +63,13 @@
|
|||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
These charts show the total number of daily posts for Subreddits: Monero, CryptoCurrency and Bitcoin. The more
|
||||
users the subreddit has, more likely it is to
|
||||
achieve mass adoption.</div>
|
||||
These charts show the total number of users for subreddits /Monero ang /CryptoCurrency as a percentage
|
||||
of the total users of /Bitcoin subreddit.
|
||||
Sudden spikes in total percentage indicate there's a new wave of people getting into other
|
||||
cryptocurrencies, not only in Bitcoin. When /CryptoCurrency dominance increase,
|
||||
it makes sense to expect that such projects will appreciate against the BTC pair. However, this is just
|
||||
and idea to observe.
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
</div>
|
||||
|
|
@ -130,8 +80,8 @@
|
|||
|
||||
<!-- Page level plugins -->
|
||||
<script>
|
||||
|
||||
var data1 = {
|
||||
|
||||
var data1 = {
|
||||
type: "scatter",
|
||||
mode: "lines",
|
||||
name: '/Cryptocurrency',
|
||||
|
|
@ -215,9 +165,9 @@
|
|||
{
|
||||
xref: 'paper',
|
||||
yref: 'paper',
|
||||
x: 1,
|
||||
x: 0.02,
|
||||
xanchor: 'auto',
|
||||
y: 0.05,
|
||||
y: 0.80,
|
||||
yanchor: 'auto',
|
||||
text: 'Moneroj<br>https://www.moneroj.net',
|
||||
showarrow: false,
|
||||
|
|
@ -233,8 +183,8 @@
|
|||
}],
|
||||
separators: ",.",
|
||||
legend: {
|
||||
x: 1,
|
||||
y: 0.40,
|
||||
x: 0.02,
|
||||
y: 0.98,
|
||||
bgcolor: '#333333',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
|
|
@ -296,8 +246,8 @@
|
|||
namelength: -1
|
||||
},
|
||||
legend: {
|
||||
x: 0.98,
|
||||
y: 0.05,
|
||||
x: 0.02,
|
||||
y: 0.98,
|
||||
bgcolor: '#000000',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
|
|
@ -365,17 +315,14 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
document.getElementById("graph_2").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
document.getElementById("graph_2").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
|
||||
|
|
|
|||
|
|
@ -9,70 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Monero's Tail Emission</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Monero's Tail Emission
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-12 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Monero Annualized Inflation (%)</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -199,13 +158,13 @@
|
|||
,range: ['2022-06-01', '2622-06-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -253,13 +212,13 @@
|
|||
,range: ['2022-06-01', '2622-06-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -285,11 +244,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,54 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Thermocap Multiple</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Thermocap Multiple
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -320,13 +295,13 @@
|
|||
,range: ['2014-02-01', '2023-02-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 120,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 10
|
||||
}
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 120,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -385,13 +360,13 @@
|
|||
,range: ['2014-02-01', '2023-12-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 100,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 10
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 100,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -417,11 +392,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="800px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Monero's Dominance Over the Number of Transactions on the Privacy Market (%)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="fas fa-arrows-alt fa-sm fa-fw text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Monero's Dominance Over the Number of Transactions on the Privacy Market (%)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Dominance</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Dominance</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -211,10 +159,10 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 120,
|
||||
b: 35,
|
||||
t: 10,
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
|
@ -265,10 +213,10 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 100,
|
||||
b: 35,
|
||||
t: 10,
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
|
@ -296,11 +244,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Average Transaction Size for both Monero and Bitcoin (Bytes)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Average Transaction Size for both Monero and Bitcoin (Bytes)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Monero Average Transaction Size</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Bitcoin Average Transaction Size</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_btc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -173,7 +121,7 @@
|
|||
yref: 'paper',
|
||||
x: 1,
|
||||
xanchor: 'auto',
|
||||
y: 0.6,
|
||||
y: 0.8,
|
||||
yanchor: 'auto',
|
||||
text: 'Moneroj<br>https://www.moneroj.net',
|
||||
showarrow: false,
|
||||
|
|
@ -232,16 +180,16 @@
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2009-01-01', '2026-01-01']
|
||||
,range: ['2009-01-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -286,16 +234,16 @@
|
|||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
,range: ['2009-01-01', '2026-01-01']
|
||||
,range: ['2009-01-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -321,11 +269,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,311 +0,0 @@
|
|||
{% extends 'charts/base.html' %}
|
||||
|
||||
{% block header %}
|
||||
<title>Moneroj.net - Transactions</title>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Monero's Daily Transaction Count in Log Scale</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Current Daily Transactions</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_transactions }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Number of Daily Transactions</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="id_Modal" tabindex="-1" role="dialog" aria-labelledby="Modal" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="Modal">Help about the chart</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Cancelar">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
This chart shows the total transactions Monero has each day on a log scale. Higher transaction count
|
||||
means the coin is being increasingly used, and since Metcalfe's Law
|
||||
proposes that more information being exchanged in a network means the network itself should be worth
|
||||
more, it also means the coin should increase in price.<br>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Fim do Modal -->
|
||||
|
||||
|
||||
<!-- Page level plugins -->
|
||||
<script>
|
||||
var data3 = {
|
||||
type: "scatter",
|
||||
mode: "lines",
|
||||
name: 'Fractal of past price',
|
||||
x: {{ dates|safe }},
|
||||
y: {{ transactions|safe }},
|
||||
line: {
|
||||
color: '#dd1d1d'
|
||||
,width: 1
|
||||
}
|
||||
};
|
||||
|
||||
var data3_mobile = {
|
||||
type: "scatter",
|
||||
mode: "lines",
|
||||
name: 'Fractal of past price',
|
||||
x: {{ dates|safe }},
|
||||
y: {{ transactions|safe }},
|
||||
line: {
|
||||
color: '#dd1d1d'
|
||||
,width: 1
|
||||
}
|
||||
};
|
||||
|
||||
var data = [data3];
|
||||
var data_mobile = [data3_mobile];
|
||||
|
||||
var layout = {
|
||||
plot_bgcolor:"#252221",
|
||||
paper_bgcolor:"#252221",
|
||||
annotations: [
|
||||
{
|
||||
xref: 'paper',
|
||||
yref: 'paper',
|
||||
x: 0.98,
|
||||
xanchor: 'auto',
|
||||
y: 0.05,
|
||||
yanchor: 'auto',
|
||||
text: 'Moneroj<br>https://www.moneroj.net',
|
||||
showarrow: false,
|
||||
borderwidth: 1,
|
||||
bordercolor: '#5f5f5f',
|
||||
bgcolor: '#333333',
|
||||
borderpad: 5,
|
||||
align: 'center',
|
||||
font: {
|
||||
color: "white",
|
||||
size: 12
|
||||
}
|
||||
}],
|
||||
separators: ",.",
|
||||
legend: {
|
||||
x: 0.8,
|
||||
y: 0.05,
|
||||
bgcolor: '#333333',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
font: {
|
||||
color: 'white',
|
||||
size: 12
|
||||
},
|
||||
traceorder: 'normal',
|
||||
xanchor: 'auto',
|
||||
yanchor: 'auto'
|
||||
},
|
||||
hoverlabel: {
|
||||
namelength: -1
|
||||
},
|
||||
yaxis: {
|
||||
type: "log",
|
||||
title: {
|
||||
text: 'Transactions/day',
|
||||
font: {
|
||||
size: 20,
|
||||
color: 'white'
|
||||
}
|
||||
},
|
||||
tickformat :",.0f"
|
||||
,nticks: 10
|
||||
,tickfont: {
|
||||
color: "#ffffff"
|
||||
,size: 12
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
},
|
||||
xaxis: {
|
||||
hoverformat: "%Y-%m-%d",
|
||||
showgrid: true,
|
||||
type: 'date',
|
||||
nticks: 10
|
||||
,tickfont: {
|
||||
color: "#dddddd"
|
||||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-05-01', '2022-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
plot_bgcolor:"black",
|
||||
paper_bgcolor:"black",
|
||||
separators: ",.",
|
||||
hoverlabel: {
|
||||
namelength: -1
|
||||
},
|
||||
legend: {
|
||||
x: 0.98,
|
||||
y: 0.05,
|
||||
bgcolor: '#000000',
|
||||
bordercolor: '#5f5f5f',
|
||||
borderwidth: 1,
|
||||
font: {
|
||||
color: 'white',
|
||||
size: 5
|
||||
},
|
||||
traceorder: 'normal',
|
||||
xanchor: 'auto',
|
||||
yanchor: 'auto'
|
||||
},
|
||||
showlegend: false,
|
||||
yaxis: {
|
||||
type: "log",
|
||||
tickformat :",.0f"
|
||||
,nticks: 10
|
||||
,tickfont: {
|
||||
color: "#ffffff"
|
||||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
},
|
||||
xaxis: {
|
||||
hoverformat: "%Y",
|
||||
showgrid: true,
|
||||
type: 'date',
|
||||
nticks: 10
|
||||
,tickfont: {
|
||||
color: "#dddddd"
|
||||
,size: 7
|
||||
}
|
||||
,gridcolor: "#444444"
|
||||
,range: ['2014-05-01', '2022-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
||||
|
||||
let el = document.createElement('div');
|
||||
document.body.appendChild(el);
|
||||
|
||||
let curEnv = envs.shift();
|
||||
|
||||
for (let env of envs.reverse()) {
|
||||
el.classList.add(`d-${env}-none`);
|
||||
|
||||
if (window.getComputedStyle(el).display === 'none') {
|
||||
curEnv = env;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
document.body.removeChild(el);
|
||||
return curEnv;
|
||||
|
||||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Average Transaction Cost</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Average Transaction Cost
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Monero's Transaction Cost</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_xmr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Bitcoin's Transaction Cost</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_btc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -235,11 +183,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -289,11 +237,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -320,11 +268,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Average Transaction Cost (Native Units)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Average Transaction Cost (Native Units)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Monero's Transaction Cost</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_xmr }} XMR</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Bitcoin's Transaction Cost</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_btc }} BTC</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -236,11 +184,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -290,11 +238,11 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -321,11 +269,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Transaction Count (linear)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Transaction Count (linear)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Daily Transactions</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_transactions }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Number of Transactions</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -257,13 +205,13 @@ var layout = {
|
|||
,range: ['2014-05-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 120,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 10
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -322,13 +270,13 @@ var layout_mobile = {
|
|||
,range: ['2014-05-01', '2023-01-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 100,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 10
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -354,11 +302,9 @@ var layout_mobile = {
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Transaction Count (log scale)</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Transaction Count (log scale)
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Daily Transactions</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_transactions }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Earnings (Monthly) Card Example -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Number of Transactions</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -258,10 +206,10 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 120,
|
||||
b: 35,
|
||||
t: 10,
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
|
@ -323,10 +271,10 @@
|
|||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 100,
|
||||
b: 35,
|
||||
t: 10,
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
|
@ -354,11 +302,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -9,81 +9,29 @@
|
|||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid"><br>
|
||||
<div class="row">
|
||||
<div class="col-xl-12 col-lg-12">
|
||||
<div class="card" id="graph1">
|
||||
<div
|
||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">Monthly Transactions</h6>
|
||||
<div class="dropdown no-arrow">
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
||||
<div id="graph" style="height: 100%; width:100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Content Row -->
|
||||
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||
<h6 class="m-0 text-light">
|
||||
Monthly Transactions
|
||||
</h6>
|
||||
|
||||
<div class="dropdown no-arrow">
|
||||
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||
About this chart?
|
||||
</a>
|
||||
<a class="dropdown-toggle" href="#" role="button"
|
||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||
<i class="bx bx-expand text-gray-400"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
|
||||
<!-- Card -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Monthly Transactions</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ now_transactions }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Card -->
|
||||
<div class="col-xl-6 col-md-6 mb-4">
|
||||
<div class="card border-left-new h-100 py-2">
|
||||
<div class="card-body">
|
||||
<div class="text-xs font-weight-bold text-info text-uppercase mb-1">
|
||||
Highest Number of Transactions</div>
|
||||
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ maximum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||
</div>
|
||||
<!-- Content Row -->
|
||||
<div class="row">
|
||||
<div class="col-xl-11 col-md-6 mb-4">
|
||||
<div class="alert alert-dark" role="alert">
|
||||
Not financial advice.
|
||||
For information about the chart, click the button >
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-1">
|
||||
<button type="button" class="btn btn-dark btn-block" data-toggle="modal" href="#"
|
||||
data-target="#id_Modal">
|
||||
<div class="col-auto">
|
||||
+
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
|
@ -225,16 +173,15 @@
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-05-01', '2023-06-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 120,
|
||||
r: 60,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 4
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
var layout_mobile = {
|
||||
|
|
@ -279,16 +226,15 @@
|
|||
,size: 13
|
||||
}
|
||||
,gridcolor: "#333333"
|
||||
,range: ['2014-05-01', '2023-06-01']
|
||||
,zeroline: true
|
||||
},
|
||||
margin: {
|
||||
l: 40,
|
||||
r: 0,
|
||||
b: 35,
|
||||
t: 10,
|
||||
pad: 0
|
||||
}
|
||||
margin: {
|
||||
l: 100,
|
||||
r: 50,
|
||||
b: 50,
|
||||
t: 20,
|
||||
pad: 10
|
||||
}
|
||||
};
|
||||
|
||||
function findBootstrapEnvironment() {
|
||||
|
|
@ -314,11 +260,9 @@
|
|||
}
|
||||
env_size = findBootstrapEnvironment();
|
||||
if (env_size == "xs") {
|
||||
document.getElementById("graph1").style.height="350px";
|
||||
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
else {
|
||||
document.getElementById("graph1").style.height="700px";
|
||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in a new issue