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 -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Miner Fees (Fees excluded new coins, Native Units)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Miner Fees (Fees excluded new coins, Native Units)
|
About this chart?
|
||||||
</h6>
|
</a>
|
||||||
<div class="dropdown no-arrow">
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
</a>
|
||||||
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -236,11 +183,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -290,11 +237,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -321,11 +268,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Miner Revenue (Dollars / day)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Miner Revenue (Dollars / day)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -235,11 +183,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -289,11 +237,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -320,11 +268,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,82 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Annualized Miner Revenue / Marketcap (Fees plus new coins, percentage)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Annualized Miner Revenue / Marketcap (Fees plus new coins,
|
About this chart?
|
||||||
percentage)</h6>
|
</a>
|
||||||
<div class="dropdown no-arrow">
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
</a>
|
||||||
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -233,15 +180,14 @@
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2008-11-14', '2024-01-01']
|
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -287,15 +233,14 @@
|
||||||
,size: 7
|
,size: 7
|
||||||
}
|
}
|
||||||
,gridcolor: "#444444"
|
,gridcolor: "#444444"
|
||||||
,range: ['2008-11-14', '2024-01-01']
|
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -322,11 +267,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,82 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Daily Miner Revenue (Fees plus new coins, Native Units / day)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Daily Miner Revenue (Fees plus new coins, Native Units / day)
|
About this chart?
|
||||||
</h6>
|
</a>
|
||||||
<div class="dropdown no-arrow">
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
</a>
|
||||||
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -237,11 +184,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -291,11 +238,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -322,11 +269,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Monero's Dominance Over Other 'Privacy' Coins (%)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Monero's Dominance Over Other 'Privacy' Coins (%)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-body" style="height: 100px;">
|
|
||||||
<div id="graph" style="height: 100%;"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -210,10 +158,10 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 120,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
@ -264,10 +212,10 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 100,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
@ -295,11 +243,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</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 -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Total Pageviews and Unique Visitors (Moneroj.net, linear)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Total Pageviews and Unique Visitors (Moneroj.net, linear)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-body" style="height: 100px;">
|
|
||||||
<div id="graph" style="height: 100%;"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
</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>
|
||||||
<!-- 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>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -162,8 +135,8 @@ var layout = {
|
||||||
}],
|
}],
|
||||||
separators: ",.",
|
separators: ",.",
|
||||||
legend: {
|
legend: {
|
||||||
x: 0.98,
|
x: 0.02,
|
||||||
y: 0.50,
|
y: 0.98,
|
||||||
bgcolor: '#333333',
|
bgcolor: '#333333',
|
||||||
bordercolor: '#5f5f5f',
|
bordercolor: '#5f5f5f',
|
||||||
borderwidth: 1,
|
borderwidth: 1,
|
||||||
|
|
@ -207,13 +180,13 @@ var layout = {
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 80,
|
l: 100,
|
||||||
r: 30,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -261,13 +234,13 @@ var layout_mobile = {
|
||||||
,range: ['2022-07-01', '2023-01-01']
|
,range: ['2022-07-01', '2023-01-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 100,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -293,11 +266,9 @@ var layout_mobile = {
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Transaction Percentage (XMR's tx / BTC's tx)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Transaction Percentage (XMR's tx / BTC's tx)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-body" style="height: 100px;">
|
|
||||||
<div id="graph" style="height: 100%;"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -211,11 +159,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -265,11 +213,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -296,11 +244,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,85 +9,34 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Monthly Percentage (XMR's tx / BTC's tx)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Monthly Percentage (XMR's tx / BTC's tx)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
||||||
|
|
||||||
<!-- Modal -->
|
<!-- Modal -->
|
||||||
<div class="modal fade" id="id_Modal" tabindex="-1" role="dialog" aria-labelledby="Modal" aria-hidden="true">
|
<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-dialog" role="document">
|
||||||
|
|
@ -225,16 +174,15 @@
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2014-05-01', '2023-06-01']
|
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -279,16 +227,15 @@
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2014-05-01', '2023-06-01']
|
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -314,11 +261,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,101 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Power Law
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Power Law</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -349,13 +277,13 @@ var layout = {
|
||||||
,size: 13
|
,size: 13
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 60,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -410,13 +338,13 @@ var layout_mobile = {
|
||||||
,size: 13
|
,size: 13
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -442,11 +370,9 @@ function findBootstrapEnvironment() {
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,101 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Price (linear scale, USD)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Price (linear scale, USD)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -263,16 +191,15 @@ var layout = {
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2014-05-01', '2023-01-01']
|
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -317,16 +244,15 @@ var layout_mobile = {
|
||||||
,size: 7
|
,size: 7
|
||||||
}
|
}
|
||||||
,gridcolor: "#444444"
|
,gridcolor: "#444444"
|
||||||
,range: ['2009-12-20', '2026-01-10']
|
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -352,11 +278,9 @@ function findBootstrapEnvironment() {
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,101 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Price (log scale, USD)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Price (log scale, USD)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -119,8 +47,8 @@
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
This chart shows the price of the coin on a log scale. The color of the points indicate their position
|
This chart shows the price of the coin on a linear scale. The color of the points indicate their
|
||||||
on the Bitcoin pair, being red as overbought and blue as cheap.<br>
|
position on the Bitcoin pair, being red as overbought and blue as cheap.<br>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||||
|
|
@ -131,9 +59,9 @@
|
||||||
<!-- Fim do Modal -->
|
<!-- Fim do Modal -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- Page level plugins -->
|
<!-- Page level plugins -->
|
||||||
<script>
|
<script>
|
||||||
|
|
||||||
var data4 = {
|
var data4 = {
|
||||||
type: "scatter",
|
type: "scatter",
|
||||||
mode: "markers",
|
mode: "markers",
|
||||||
|
|
@ -202,7 +130,7 @@ var layout = {
|
||||||
{
|
{
|
||||||
xref: 'paper',
|
xref: 'paper',
|
||||||
yref: 'paper',
|
yref: 'paper',
|
||||||
x: 0.50,
|
x: 0.98,
|
||||||
xanchor: 'auto',
|
xanchor: 'auto',
|
||||||
y: 0.02,
|
y: 0.02,
|
||||||
yanchor: 'auto',
|
yanchor: 'auto',
|
||||||
|
|
@ -263,16 +191,15 @@ var layout = {
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2014-05-01', '2023-01-01']
|
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -317,16 +244,15 @@ var layout_mobile = {
|
||||||
,size: 7
|
,size: 7
|
||||||
}
|
}
|
||||||
,gridcolor: "#444444"
|
,gridcolor: "#444444"
|
||||||
,range: ['2009-12-20', '2026-01-10']
|
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -352,11 +278,9 @@ function findBootstrapEnvironment() {
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -5,95 +5,32 @@
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Price (BTC)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Price (BTC)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -310,11 +247,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -341,11 +278,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -5,95 +5,32 @@
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Price (BTC)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Price (BTC)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -310,11 +247,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -341,11 +278,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,100 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Total Dominance of Privacy Coins Over the Cryptocurrency Market (%)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Total Dominance of Privacy Coins Over the Cryptocurrency Market (%)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -248,11 +177,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -302,11 +231,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -333,11 +262,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,100 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Total Marketcap of Privacy Coins (USD)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Total Marketcap of Privacy Coins (USD)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -250,15 +179,15 @@
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2014-04-14', '2024-01-01']
|
,range: ['2014-04-14', '2023-01-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -304,15 +233,15 @@
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2014-04-14', '2024-01-01']
|
,range: ['2014-04-14', '2023-01-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -339,11 +268,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Monero's Coinmarketcap Rank
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Monero's Coinmarketcap Rank</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-body" style="height: 100px;">
|
|
||||||
<div id="graph" style="height: 100%;"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -255,13 +203,13 @@ var layout = {
|
||||||
,range: ['2014-05-01', '2023-08-01']
|
,range: ['2014-05-01', '2023-08-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 120,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -320,13 +268,13 @@ var layout_mobile = {
|
||||||
,range: ['2014-05-01', '2023-08-01']
|
,range: ['2014-05-01', '2023-08-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 100,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -352,11 +300,9 @@ function findBootstrapEnvironment() {
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Security Budget for Monero and Bitcoin (Dollars/second)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Security Budget for Monero and Bitcoin (Dollars/second)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -174,7 +122,7 @@
|
||||||
yref: 'paper',
|
yref: 'paper',
|
||||||
x: 1,
|
x: 1,
|
||||||
xanchor: 'auto',
|
xanchor: 'auto',
|
||||||
y: 0.6,
|
y: 0.25,
|
||||||
yanchor: 'auto',
|
yanchor: 'auto',
|
||||||
text: 'Moneroj<br>https://www.moneroj.net',
|
text: 'Moneroj<br>https://www.moneroj.net',
|
||||||
showarrow: false,
|
showarrow: false,
|
||||||
|
|
@ -191,7 +139,7 @@
|
||||||
separators: ",.",
|
separators: ",.",
|
||||||
legend: {
|
legend: {
|
||||||
x: 1,
|
x: 1,
|
||||||
y: 0.95,
|
y: 0.02,
|
||||||
bgcolor: '#333333',
|
bgcolor: '#333333',
|
||||||
bordercolor: '#5f5f5f',
|
bordercolor: '#5f5f5f',
|
||||||
borderwidth: 1,
|
borderwidth: 1,
|
||||||
|
|
@ -233,16 +181,16 @@
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2009-01-01', '2026-01-01']
|
,range: ['2009-01-01', '2023-01-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -287,16 +235,16 @@
|
||||||
,size: 7
|
,size: 7
|
||||||
}
|
}
|
||||||
,gridcolor: "#444444"
|
,gridcolor: "#444444"
|
||||||
,range: ['2009-01-01', '2026-01-01']
|
,range: ['2009-01-01', '2023-01-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -322,11 +270,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,99 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Stock-to-flow Model
|
||||||
<div class="col-xl-12">
|
</h6>
|
||||||
<div class="alert alert-danger" role="alert">
|
|
||||||
Warning: the price described by the gray line is just a suggestion of future behavior based on
|
<div class="dropdown no-arrow">
|
||||||
past price-action pattern (adjusted for variable inflation).
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
</div>
|
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>
|
</div>
|
||||||
<div class="row">
|
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||||
<div class="col-xl-12 col-lg-12">
|
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||||
<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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -314,13 +244,13 @@ var layout = {
|
||||||
,range: ['2014-05-01', '2023-07-31']
|
,range: ['2014-05-01', '2023-07-31']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -368,13 +298,13 @@ var layout_mobile = {
|
||||||
,range: ['2014-05-01', '2023-07-31']
|
,range: ['2014-05-01', '2023-07-31']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -400,11 +330,9 @@ function findBootstrapEnvironment() {
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,91 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Stock-to-flow Model
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Stock-to-flow Model (linear scale)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -111,7 +49,7 @@
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
This chart shows the price of the coin on each date, coloring the points indicating their position on
|
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.
|
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
|
Multiplier is 1.65 for Monero (it's higher for Bitcoin's stock-to-flow
|
||||||
model, for example).<br>
|
model, for example).<br>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -279,16 +217,16 @@ var layout = {
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2014-05-01', '2023-01-01']
|
,range: ['2014-05-01', '2023-07-31']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -333,16 +271,16 @@ var layout_mobile = {
|
||||||
,size: 7
|
,size: 7
|
||||||
}
|
}
|
||||||
,gridcolor: "#444444"
|
,gridcolor: "#444444"
|
||||||
,range: ['2014-05-01', '2023-01-01']
|
,range: ['2014-05-01', '2023-07-31']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -368,11 +306,9 @@ function findBootstrapEnvironment() {
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,80 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Stock-to-flow Multiple (Price / SF Model)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Stock-to-flow Multiple (Price / SF Model)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -295,13 +244,13 @@ var layout = {
|
||||||
,range: ['2014-02-01', '2023-06-01']
|
,range: ['2014-02-01', '2023-06-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -349,13 +298,13 @@ var layout_mobile = {
|
||||||
,range: ['2014-02-01', '2023-06-01']
|
,range: ['2014-02-01', '2023-06-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -381,11 +330,9 @@ function findBootstrapEnvironment() {
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,54 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Sharpe Ratio
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Sharpe Ratio</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- Content Row -->
|
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||||
<div class="row">
|
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||||
<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>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -161,7 +136,7 @@
|
||||||
yref: 'paper',
|
yref: 'paper',
|
||||||
x: 0.02,
|
x: 0.02,
|
||||||
xanchor: 'auto',
|
xanchor: 'auto',
|
||||||
y: 0.50,
|
y: 0.85,
|
||||||
yanchor: 'auto',
|
yanchor: 'auto',
|
||||||
text: 'Moneroj<br>https://www.moneroj.net',
|
text: 'Moneroj<br>https://www.moneroj.net',
|
||||||
showarrow: false,
|
showarrow: false,
|
||||||
|
|
@ -243,10 +218,10 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 120,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
@ -308,10 +283,10 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 100,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
@ -339,11 +314,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="800px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Shielded Transactions
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Shielded Transactions</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -314,13 +262,13 @@ var data1 = {
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -367,13 +315,13 @@ var data1 = {
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -399,11 +347,9 @@ var data1 = {
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,100 +9,45 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Total Number of Reddit Subscribers for Bitcoin and CryptoCurrency
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Total Number of Reddit Subscribers for Bitcoin and CryptoCurrency
|
About this chart?
|
||||||
</h6>
|
</a>
|
||||||
</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>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||||
<div class="row">
|
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||||
<div class="col-xl-12 col-lg-12">
|
</div>
|
||||||
<div class="card" id="graph_2">
|
</div>
|
||||||
<div
|
</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>
|
<!-- Content Row -->
|
||||||
</div>
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
<div class="card" id="graph_2" style="width: 100%; height: 100%;">
|
||||||
<div id="graph2" style="height: 100%; width:100%;"></div>
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
</div>
|
<h6 class="m-0 text-light">
|
||||||
</div>
|
Total Number of Reddit Subscribers for Monero
|
||||||
<br>
|
</h6>
|
||||||
</div>
|
|
||||||
|
<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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -368,14 +313,10 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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('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});
|
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
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('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});
|
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Marketcap Divided by Number of Reddit Subscribers
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Marketcap Divided by Number of Reddit Subscribers</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -237,11 +185,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -291,11 +239,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -322,11 +270,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,90 +9,45 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Reddit Subscribers of /CryptoCurrency as a Percentage of /Bitcoin
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Reddit Subscribers of /CryptoCurrency as a Percentage of /Bitcoin
|
About this chart?
|
||||||
</h6>
|
</a>
|
||||||
</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>
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||||
<div class="col-xl-12 col-lg-12">
|
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||||
<div class="card" id="graph12">
|
</div>
|
||||||
<div
|
</div>
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
</div>
|
||||||
<h6 class="m-0 text-light">Reddit Subscribers of /Monero as a Percentage of /Bitcoin</h6>
|
|
||||||
</div>
|
<!-- Content Row -->
|
||||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
<div id="graph2" style="height: 100%; width:100%;"></div>
|
<div class="card" id="graph_2" style="width: 100%; height: 100%;">
|
||||||
</div>
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
</div>
|
<h6 class="m-0 text-light">
|
||||||
<br>
|
Reddit Subscribers of /Monero as a Percentage of /Bitcoin
|
||||||
</div>
|
</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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -123,10 +78,10 @@
|
||||||
</div>
|
</div>
|
||||||
<!-- Fim do Modal -->
|
<!-- Fim do Modal -->
|
||||||
|
|
||||||
|
|
||||||
<!-- Page level plugins -->
|
<!-- Page level plugins -->
|
||||||
<script>
|
<script>
|
||||||
var data1 = {
|
|
||||||
|
var data1 = {
|
||||||
type: "scatter",
|
type: "scatter",
|
||||||
mode: "lines",
|
mode: "lines",
|
||||||
name: '/Monero as % of /Bitcoin',
|
name: '/Monero as % of /Bitcoin',
|
||||||
|
|
@ -179,177 +134,171 @@
|
||||||
var data_mobile = [data2_mobile];
|
var data_mobile = [data2_mobile];
|
||||||
var data_2 = [data1];
|
var data_2 = [data1];
|
||||||
var data_mobile_2 = [data1_mobile];
|
var data_mobile_2 = [data1_mobile];
|
||||||
|
var layout = {
|
||||||
var layout = {
|
plot_bgcolor:"#252221",
|
||||||
plot_bgcolor:"#252221",
|
paper_bgcolor:"#252221",
|
||||||
paper_bgcolor:"#252221",
|
annotations: [
|
||||||
annotations: [
|
{
|
||||||
{
|
xref: 'paper',
|
||||||
xref: 'paper',
|
yref: 'paper',
|
||||||
yref: 'paper',
|
x: 1,
|
||||||
x: 1,
|
xanchor: 'auto',
|
||||||
xanchor: 'auto',
|
y: 0.05,
|
||||||
y: 0.05,
|
yanchor: 'auto',
|
||||||
yanchor: 'auto',
|
text: 'Moneroj<br>https://www.moneroj.net',
|
||||||
text: 'Moneroj<br>https://www.moneroj.net',
|
showarrow: false,
|
||||||
showarrow: false,
|
borderwidth: 1,
|
||||||
borderwidth: 1,
|
bordercolor: '#5f5f5f',
|
||||||
bordercolor: '#5f5f5f',
|
bgcolor: '#333333',
|
||||||
bgcolor: '#333333',
|
borderpad: 5,
|
||||||
borderpad: 5,
|
align: 'center',
|
||||||
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',
|
|
||||||
font: {
|
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"
|
hoverlabel: {
|
||||||
,nticks: 10
|
namelength: -1
|
||||||
,tickfont: {
|
},
|
||||||
color: "#ffffff"
|
yaxis: {
|
||||||
,size: 12
|
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: {
|
var layout_mobile = {
|
||||||
hoverformat: "%Y-%m-%d",
|
plot_bgcolor:"black",
|
||||||
showgrid: true,
|
paper_bgcolor:"black",
|
||||||
type: 'date',
|
separators: ",.",
|
||||||
nticks: 10
|
hoverlabel: {
|
||||||
,tickfont: {
|
namelength: -1
|
||||||
color: "#dddddd"
|
},
|
||||||
,size: 13
|
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
|
function findBootstrapEnvironment() {
|
||||||
},
|
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
||||||
margin: {
|
|
||||||
l: 120,
|
let el = document.createElement('div');
|
||||||
r: 60,
|
document.body.appendChild(el);
|
||||||
b: 35,
|
|
||||||
t: 10,
|
let curEnv = envs.shift();
|
||||||
pad: 4
|
|
||||||
|
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") {
|
||||||
var layout_mobile = {
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
plot_bgcolor:"black",
|
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
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
|
|
||||||
}
|
}
|
||||||
};
|
else {
|
||||||
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
function findBootstrapEnvironment() {
|
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
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;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
document.body.removeChild(el);
|
{% endblock %}
|
||||||
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});
|
|
||||||
|
|
||||||
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 -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
/Bitcoin, /CryptoCurrency and /Monero Monthly New Subscribers
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">/Bitcoin, /CryptoCurrency and /Monero Monthly New Subscribers
|
About this chart?
|
||||||
</h6>
|
</a>
|
||||||
</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>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||||
<div class="row">
|
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||||
<div class="col-xl-12 col-lg-12">
|
</div>
|
||||||
<div class="card" id="graph12">
|
</div>
|
||||||
<div
|
</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
|
<!-- Content Row -->
|
||||||
in Subscribers</h6>
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
</div>
|
<div class="card" id="graph_2" style="width: 100%; height: 100%;">
|
||||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div id="graph2" style="height: 100%; width:100%;"></div>
|
<h6 class="m-0 text-light">
|
||||||
</div>
|
/Bitcoin, /CryptoCurrency and /Monero Monthly Percentage Increase
|
||||||
</div>
|
</h6>
|
||||||
<br>
|
|
||||||
</div>
|
<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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -546,42 +491,37 @@
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
||||||
|
|
||||||
let el = document.createElement('div');
|
let el = document.createElement('div');
|
||||||
document.body.appendChild(el);
|
document.body.appendChild(el);
|
||||||
|
|
||||||
let curEnv = envs.shift();
|
let curEnv = envs.shift();
|
||||||
|
|
||||||
for (let env of envs.reverse()) {
|
for (let env of envs.reverse()) {
|
||||||
el.classList.add(`d-${env}-none`);
|
el.classList.add(`d-${env}-none`);
|
||||||
|
|
||||||
if (window.getComputedStyle(el).display === 'none') {
|
if (window.getComputedStyle(el).display === 'none') {
|
||||||
curEnv = env;
|
curEnv = env;
|
||||||
break;
|
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);
|
{% endblock %}
|
||||||
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});
|
|
||||||
|
|
||||||
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 -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Total Number of Reddit Subscribers for Monero and Number of Transactions
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Total Number of Reddit Subscribers for Monero and Number of Transactions</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||||
<!-- Content Row -->
|
<div id="graph2" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||||
<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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -255,11 +204,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 120,
|
r: 100,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -320,11 +269,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 100,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -351,11 +300,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
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});
|
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
{% extends 'charts/base.html' %}
|
{% extends 'charts/base.html' %}
|
||||||
|
|
||||||
{% block header %}
|
{% block header %}
|
||||||
<title>Moneroj.net - Reddit Comments</title>
|
<title>Moneroj.net - Reddit Subscribers</title>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
@ -9,100 +9,45 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Comments per day on Subreddits /Bitcoin and /CryptoCurrency
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Comments per day on Subreddits /Bitcoin and /CryptoCurrency
|
About this chart?
|
||||||
</h6>
|
</a>
|
||||||
</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>
|
||||||
</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 class="row">
|
</div>
|
||||||
<div class="col-xl-12 col-lg-12">
|
</div>
|
||||||
<div class="card" id="graph_2">
|
</div>
|
||||||
<div
|
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<!-- Content Row -->
|
||||||
<h6 class="m-0 text-light">Comments per day on Subreddit /Monero</h6>
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
</div>
|
<div class="card" id="graph_2" style="width: 100%; height: 100%;">
|
||||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div id="graph2" style="height: 100%; width:100%;"></div>
|
<h6 class="m-0 text-light">
|
||||||
</div>
|
Comments per day on Subreddit /Monero
|
||||||
</div>
|
</h6>
|
||||||
<br>
|
|
||||||
</div>
|
<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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -118,9 +63,13 @@
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
These charts show the total number of daily comments for Subreddits: Monero, CryptoCurrency and Bitcoin. The more
|
These charts show the total number of users for subreddits /Monero ang /CryptoCurrency as a percentage
|
||||||
users the subreddit has, more likely it is to
|
of the total users of /Bitcoin subreddit.
|
||||||
achieve mass adoption.</div>
|
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">
|
<div class="modal-footer">
|
||||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -216,9 +165,9 @@
|
||||||
{
|
{
|
||||||
xref: 'paper',
|
xref: 'paper',
|
||||||
yref: 'paper',
|
yref: 'paper',
|
||||||
x: 1,
|
x: 0.02,
|
||||||
xanchor: 'auto',
|
xanchor: 'auto',
|
||||||
y: 0.05,
|
y: 0.98,
|
||||||
yanchor: 'auto',
|
yanchor: 'auto',
|
||||||
text: 'Moneroj<br>https://www.moneroj.net',
|
text: 'Moneroj<br>https://www.moneroj.net',
|
||||||
showarrow: false,
|
showarrow: false,
|
||||||
|
|
@ -234,8 +183,8 @@
|
||||||
}],
|
}],
|
||||||
separators: ",.",
|
separators: ",.",
|
||||||
legend: {
|
legend: {
|
||||||
x: 1,
|
x: 0.02,
|
||||||
y: 0.40,
|
y: 0.80,
|
||||||
bgcolor: '#333333',
|
bgcolor: '#333333',
|
||||||
bordercolor: '#5f5f5f',
|
bordercolor: '#5f5f5f',
|
||||||
borderwidth: 1,
|
borderwidth: 1,
|
||||||
|
|
@ -297,8 +246,8 @@
|
||||||
namelength: -1
|
namelength: -1
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
x: 0.98,
|
x: 0.02,
|
||||||
y: 0.05,
|
y: 0.98,
|
||||||
bgcolor: '#000000',
|
bgcolor: '#000000',
|
||||||
bordercolor: '#5f5f5f',
|
bordercolor: '#5f5f5f',
|
||||||
borderwidth: 1,
|
borderwidth: 1,
|
||||||
|
|
@ -343,6 +292,7 @@
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
let envs = ['xs', 'sm', 'md', 'lg', 'xl'];
|
||||||
|
|
||||||
|
|
@ -366,17 +316,14 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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('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});
|
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
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('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});
|
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
{% extends 'charts/base.html' %}
|
{% extends 'charts/base.html' %}
|
||||||
|
|
||||||
{% block header %}
|
{% block header %}
|
||||||
<title>Moneroj.net - Reddit Posts</title>
|
<title>Moneroj.net - Reddit Subscribers</title>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
@ -9,99 +9,45 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Posts per day on Subreddits /Bitcoin and /CryptoCurrency
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Posts per day on Subreddits /Bitcoin and /CryptoCurrency
|
About this chart?
|
||||||
</h6>
|
</a>
|
||||||
</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>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||||
<div class="row">
|
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||||
<div class="col-xl-12 col-lg-12">
|
</div>
|
||||||
<div class="card" id="graph_2">
|
</div>
|
||||||
<div
|
</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>
|
<!-- Content Row -->
|
||||||
</div>
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
<div class="card-body pb-0 pt-0 pl-0 pr-0" style="height: 100px;">
|
<div class="card" id="graph_2" style="width: 100%; height: 100%;">
|
||||||
<div id="graph2" style="height: 100%; width:100%;"></div>
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
</div>
|
<h6 class="m-0 text-light">
|
||||||
</div>
|
Posts per day on Reddit /Monero
|
||||||
<br>
|
</h6>
|
||||||
</div>
|
|
||||||
|
<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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -117,9 +63,13 @@
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
These charts show the total number of daily posts for Subreddits: Monero, CryptoCurrency and Bitcoin. The more
|
These charts show the total number of users for subreddits /Monero ang /CryptoCurrency as a percentage
|
||||||
users the subreddit has, more likely it is to
|
of the total users of /Bitcoin subreddit.
|
||||||
achieve mass adoption.</div>
|
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">
|
<div class="modal-footer">
|
||||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -130,8 +80,8 @@
|
||||||
|
|
||||||
<!-- Page level plugins -->
|
<!-- Page level plugins -->
|
||||||
<script>
|
<script>
|
||||||
|
|
||||||
var data1 = {
|
var data1 = {
|
||||||
type: "scatter",
|
type: "scatter",
|
||||||
mode: "lines",
|
mode: "lines",
|
||||||
name: '/Cryptocurrency',
|
name: '/Cryptocurrency',
|
||||||
|
|
@ -215,9 +165,9 @@
|
||||||
{
|
{
|
||||||
xref: 'paper',
|
xref: 'paper',
|
||||||
yref: 'paper',
|
yref: 'paper',
|
||||||
x: 1,
|
x: 0.02,
|
||||||
xanchor: 'auto',
|
xanchor: 'auto',
|
||||||
y: 0.05,
|
y: 0.80,
|
||||||
yanchor: 'auto',
|
yanchor: 'auto',
|
||||||
text: 'Moneroj<br>https://www.moneroj.net',
|
text: 'Moneroj<br>https://www.moneroj.net',
|
||||||
showarrow: false,
|
showarrow: false,
|
||||||
|
|
@ -233,8 +183,8 @@
|
||||||
}],
|
}],
|
||||||
separators: ",.",
|
separators: ",.",
|
||||||
legend: {
|
legend: {
|
||||||
x: 1,
|
x: 0.02,
|
||||||
y: 0.40,
|
y: 0.98,
|
||||||
bgcolor: '#333333',
|
bgcolor: '#333333',
|
||||||
bordercolor: '#5f5f5f',
|
bordercolor: '#5f5f5f',
|
||||||
borderwidth: 1,
|
borderwidth: 1,
|
||||||
|
|
@ -296,8 +246,8 @@
|
||||||
namelength: -1
|
namelength: -1
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
x: 0.98,
|
x: 0.02,
|
||||||
y: 0.05,
|
y: 0.98,
|
||||||
bgcolor: '#000000',
|
bgcolor: '#000000',
|
||||||
bordercolor: '#5f5f5f',
|
bordercolor: '#5f5f5f',
|
||||||
borderwidth: 1,
|
borderwidth: 1,
|
||||||
|
|
@ -365,17 +315,14 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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('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});
|
Plotly.newPlot('graph2', data_mobile_2, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
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('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});
|
Plotly.newPlot('graph2', data_2, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -9,70 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Monero's Tail Emission
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Monero's Tail Emission</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -199,13 +158,13 @@
|
||||||
,range: ['2022-06-01', '2622-06-01']
|
,range: ['2022-06-01', '2622-06-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -253,13 +212,13 @@
|
||||||
,range: ['2022-06-01', '2622-06-01']
|
,range: ['2022-06-01', '2622-06-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -285,11 +244,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,54 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Thermocap Multiple
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Thermocap Multiple</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-body" style="height: 100px;">
|
|
||||||
<div id="graph" style="height: 100%;"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- Content Row -->
|
<div class="card-body" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
|
||||||
<div class="row">
|
<div id="graph" style="width: 100%; height: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"></div>
|
||||||
<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>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -320,13 +295,13 @@
|
||||||
,range: ['2014-02-01', '2023-02-01']
|
,range: ['2014-02-01', '2023-02-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 120,
|
||||||
r: 120,
|
r: 120,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -385,13 +360,13 @@
|
||||||
,range: ['2014-02-01', '2023-12-01']
|
,range: ['2014-02-01', '2023-12-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 100,
|
r: 100,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -417,11 +392,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="800px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Monero's Dominance Over the Number of Transactions on the Privacy Market (%)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Monero's Dominance Over the Number of Transactions on the Privacy Market (%)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="fas fa-arrows-alt fa-sm fa-fw text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-body" style="height: 100px;">
|
|
||||||
<div id="graph" style="height: 100%;"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -211,10 +159,10 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 120,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
@ -265,10 +213,10 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 100,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
@ -296,11 +244,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Average Transaction Size for both Monero and Bitcoin (Bytes)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Average Transaction Size for both Monero and Bitcoin (Bytes)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -173,7 +121,7 @@
|
||||||
yref: 'paper',
|
yref: 'paper',
|
||||||
x: 1,
|
x: 1,
|
||||||
xanchor: 'auto',
|
xanchor: 'auto',
|
||||||
y: 0.6,
|
y: 0.8,
|
||||||
yanchor: 'auto',
|
yanchor: 'auto',
|
||||||
text: 'Moneroj<br>https://www.moneroj.net',
|
text: 'Moneroj<br>https://www.moneroj.net',
|
||||||
showarrow: false,
|
showarrow: false,
|
||||||
|
|
@ -232,16 +180,16 @@
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2009-01-01', '2026-01-01']
|
,range: ['2009-01-01', '2023-01-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -286,16 +234,16 @@
|
||||||
,size: 7
|
,size: 7
|
||||||
}
|
}
|
||||||
,gridcolor: "#444444"
|
,gridcolor: "#444444"
|
||||||
,range: ['2009-01-01', '2026-01-01']
|
,range: ['2009-01-01', '2023-01-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -321,11 +269,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</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 -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Average Transaction Cost
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Average Transaction Cost</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -235,11 +183,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -289,11 +237,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -320,11 +268,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Average Transaction Cost (Native Units)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Average Transaction Cost (Native Units)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-body" style="height: 100px;">
|
|
||||||
<div id="graph" style="height: 100%;"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -236,11 +184,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -290,11 +238,11 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -321,11 +269,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Transaction Count (linear)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Transaction Count (linear)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-body" style="height: 100px;">
|
|
||||||
<div id="graph" style="height: 100%;"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -257,13 +205,13 @@ var layout = {
|
||||||
,range: ['2014-05-01', '2023-01-01']
|
,range: ['2014-05-01', '2023-01-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 120,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -322,13 +270,13 @@ var layout_mobile = {
|
||||||
,range: ['2014-05-01', '2023-01-01']
|
,range: ['2014-05-01', '2023-01-01']
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 100,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -354,11 +302,9 @@ var layout_mobile = {
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Transaction Count (log scale)
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Transaction Count (log scale)</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-body" style="height: 100px;">
|
|
||||||
<div id="graph" style="height: 100%;"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -258,10 +206,10 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 120,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
@ -323,10 +271,10 @@
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 100,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 10
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
@ -354,11 +302,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -9,81 +9,29 @@
|
||||||
<!-- Content Wrapper -->
|
<!-- Content Wrapper -->
|
||||||
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
<div id="content-wrapper" style="background-color:rgb(48, 44, 41)">
|
||||||
|
|
||||||
<!-- Main Content -->
|
<!-- Content Row -->
|
||||||
<div id="content">
|
<div class="row" style="height: 92%; margin: 10px 10px 10px 10px;">
|
||||||
|
<div class="card" id="graph1" style="width: 100%; height: 100%;">
|
||||||
<!-- Begin Page Content -->
|
<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
||||||
<div class="container-fluid"><br>
|
<h6 class="m-0 text-light">
|
||||||
<div class="row">
|
Monthly Transactions
|
||||||
<div class="col-xl-12 col-lg-12">
|
</h6>
|
||||||
<div class="card" id="graph1">
|
|
||||||
<div
|
<div class="dropdown no-arrow">
|
||||||
class="card-header py-3 d-flex flex-row align-items-center justify-content-between text-white">
|
<a data-toggle="modal" href="#" class="link_graph" data-target="#id_Modal">
|
||||||
<h6 class="m-0 text-light">Monthly Transactions</h6>
|
About this chart?
|
||||||
<div class="dropdown no-arrow">
|
</a>
|
||||||
<a class="dropdown-toggle" href="#" role="button"
|
<a class="dropdown-toggle" href="#" role="button"
|
||||||
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
onclick="$('#graph1').toggleClass('fullscreen');window.dispatchEvent(new Event('resize'));">
|
||||||
<i class="bx bx-expand text-gray-400"></i>
|
<i class="bx bx-expand text-gray-400"></i>
|
||||||
</a>
|
</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>
|
||||||
</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>
|
||||||
<!-- 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>
|
</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>
|
</div>
|
||||||
<!-- /.container-fluid -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Main Content -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- End of Content Wrapper -->
|
<!-- End of Content Wrapper -->
|
||||||
|
|
@ -225,16 +173,15 @@
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2014-05-01', '2023-06-01']
|
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 120,
|
l: 100,
|
||||||
r: 60,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 4
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var layout_mobile = {
|
var layout_mobile = {
|
||||||
|
|
@ -279,16 +226,15 @@
|
||||||
,size: 13
|
,size: 13
|
||||||
}
|
}
|
||||||
,gridcolor: "#333333"
|
,gridcolor: "#333333"
|
||||||
,range: ['2014-05-01', '2023-06-01']
|
|
||||||
,zeroline: true
|
,zeroline: true
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
l: 40,
|
l: 100,
|
||||||
r: 0,
|
r: 50,
|
||||||
b: 35,
|
b: 50,
|
||||||
t: 10,
|
t: 20,
|
||||||
pad: 0
|
pad: 10
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function findBootstrapEnvironment() {
|
function findBootstrapEnvironment() {
|
||||||
|
|
@ -314,11 +260,9 @@
|
||||||
}
|
}
|
||||||
env_size = findBootstrapEnvironment();
|
env_size = findBootstrapEnvironment();
|
||||||
if (env_size == "xs") {
|
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});
|
Plotly.newPlot('graph', data_mobile, layout_mobile, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.getElementById("graph1").style.height="700px";
|
|
||||||
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
Plotly.newPlot('graph', data, layout, {responsive: true, modeBarButtonsToRemove: ['toImage', 'hoverCompareCartesian', 'hoverClosest2d', 'toggleSpikelines', 'lasso2d', 'select2d', 'hoverClosestCartesian'], displaylogo: false});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue