40 lines
1.7 KiB
JSON
Executable File
40 lines
1.7 KiB
JSON
Executable File
<!-- required files -->
|
|
<script src="../assets/plugins/apexcharts/dist/apexcharts.min.js"></script>
|
|
|
|
<div id="apex-candelstick-chart"></div>
|
|
|
|
<script>
|
|
var chart = new ApexCharts(
|
|
document.querySelector('#apex-candelstick-chart'), {
|
|
chart: { height: 350, type: 'candlestick' },
|
|
series: [{
|
|
data: [
|
|
{ x: new Date(1538778600000), y: [6629.81, 6650.5, 6623.04, 6633.33] },
|
|
{ x: new Date(1538780400000), y: [6632.01, 6643.59, 6620, 6630.11] },
|
|
{ x: new Date(1538782200000), y: [6630.71, 6648.95, 6623.34, 6635.65] },
|
|
{ x: new Date(1538784000000), y: [6635.65, 6651, 6629.67, 6638.24] },
|
|
{ x: new Date(1538785800000), y: [6638.24, 6640, 6620, 6624.47] },
|
|
{ x: new Date(1538787600000), y: [6624.53, 6636.03, 6621.68, 6624.31] },
|
|
{ x: new Date(1538789400000), y: [6624.61, 6632.2, 6617, 6626.02] },
|
|
{ x: new Date(1538791200000), y: [6627, 6627.62, 6584.22, 6603.02] },
|
|
{ x: new Date(1538793000000), y: [6605, 6608.03, 6598.95, 6604.01] },
|
|
{ x: new Date(1538794800000), y: [6604.5, 6614.4, 6602.26, 6608.02] }
|
|
]
|
|
}],
|
|
title: { text: 'CandleStick Chart', align: 'left' },
|
|
xaxis: {
|
|
type: 'datetime',
|
|
axisBorder: { show: true, color: COLOR_SILVER_TRANSPARENT_5, height: 1, width: '100%', offsetX: 0, offsetY: -1 },
|
|
axisTicks: { show: true, borderType: 'solid', color: COLOR_SILVER, height: 6, offsetX: 0, offsetY: 0 }
|
|
},
|
|
yaxis: { tooltip: { enabled: true } },
|
|
plotOptions: {
|
|
candlestick: {
|
|
colors: { upward: app.color.success, downward: app.color.red }
|
|
}
|
|
}
|
|
}
|
|
);
|
|
|
|
chart.render();
|
|
</script> |