coin/chart
1
0
Fork 0
mirror of https://git.hmsn.ink/coin/chart.git synced 2026-03-20 00:02:17 +09:00
Code Issues Packages Projects Releases Wiki Activity

rsi 추가

Browse Source
This commit is contained in:
bangae1
2025-08-24 22:00:11 +09:00
parent 7cf6f367ea
commit f5059ed0ce
8 changed files with 404 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
src/App.vue
View File

@@ -10,7 +10,9 @@ import { ref } from 'vue';
*/
import LWChart from './components/LWChart.vue';
import {getCandleList} from '/@src/utils/api'
import {calculateMACD, calculateEMA, calculateBollingerBands} from "./utils/meter.js";
import {calculateMACD, calculateEMA, calculateBollingerBands, calculateRSI} from "./utils/meter.js";
import {entrySignals} from "./utils/cro.js";
import {swingSignal} from "./utils/sig.js";
/**
* Generates sample data for the lightweight chart
* @param {Boolean} ohlc Whether generated dat should include open, high, low, and close values
@@ -21,7 +23,8 @@ const lazyLock = ref(false)
const positionData = ref('')
const contract = ref('BTC_USDT')
const time = ref('15m')
/* Interval : "10s", "1m", "5m", "15m", "30m", "1h", "4h", "8h", "1d", "7d"*/
const time = ref('1h')
const chartOptions = ref({
layout: {
textColor: 'black',
@@ -42,6 +45,7 @@ const candleTick = ref([])
const ema = ref([])
const macd = ref({})
const bb = ref({})
const rsi = ref({})
const selectCoins = [
{ title: 'BTC_USDT'},
@@ -87,17 +91,20 @@ const candleOptions = ref({
const macdLineOptions = ref({
lineWidth: 2,
color: '#FFBAB5'
color: '#FFBAB5',
title: 'MACD',
});
const macdSignalOptions = ref({
lineWidth: 2,
color: '#AD81FF'
color: '#AD81FF',
title: 'SIGNAL',
});
const macdHistogramOptions = ref({
lineWidth: 2,
color: '#27FFE6'
color: '#27FFE6',
title: 'HISTOGRAM',
});
const upperBbOptions = ref({
@@ -121,6 +128,12 @@ const lowerBbOptions = ref({
title: 'LowerBB',
})
const rsiLineOptions = ref({
lineWidth: 2,
color: '#AD81FF',
title: 'RSI',
});
const chartType = ref('candlestick');
const lwChart = ref();
@@ -130,14 +143,16 @@ onMounted(() => {
})
const init = (cont, ti) => {
socket = new WebSocket("ws://127.0.0.1:8765");
socket = new WebSocket("wss://fx-ws.gateio.ws/v4/ws/usdt");
const dt = new Date()
getCandleList(cont, ti, Math.round(dt.getTime()/1000)).then(data => {
ema.value = calculateEMA(data, 20)
macd.value = calculateMACD(data)
bb.value = calculateBollingerBands(data)
rsi.value = calculateRSI(data)
// console.log(swingSignal(data))
// console.table(entrySignals(data))
candleTick.value = data
console.log(bb.value)
})
candleSocket(cont, ti)
@@ -145,6 +160,7 @@ const init = (cont, ti) => {
const distroy = (cont) => {
candleTick.value = []
socket.close()
}
const lazyLoad = async (ti) => {
@@ -154,6 +170,7 @@ const lazyLoad = async (ti) => {
ema.value = calculateEMA(data, 20)
macd.value = calculateMACD(data)
bb.value = calculateBollingerBands(data)
rsi.value = calculateRSI(data)
setTimeout(() => {lazyLock.value = false}, 3000)
})
@@ -161,26 +178,34 @@ const lazyLoad = async (ti) => {
const candleSocket = (cont, ti) => {
socket.addEventListener('open', (event) => {
socket.send(JSON.stringify({"type":"subscribe", "channel": cont, "time": ti}))
// socket.send(JSON.stringify({"type":"subscribe", "channel": cont, "time": ti}))
console.log(cont, ti)
socket.send(JSON.stringify({"time" : curToUnix(), "channel" : "futures.candlesticks","event": "subscribe", "payload" : [ti, cont]}))
})
socket.addEventListener('message', (message) => {
const msg = JSON.parse(message.data)
const item = JSON.parse(msg.msg)
if(msg.event === 'update') {
const item = msg.result[0]
const ticks = candleTick.value
if(item.t === ticks[ticks.length - 1].t) {
ticks[ticks.length - 1] = item
candleTick.value = [...ticks]
} else {
ticks.push(item)
candleTick.value = [...ticks]
const ticks = candleTick.value
if(item.t === ticks[ticks.length - 1].t) {
ticks[ticks.length - 1] = item
candleTick.value = [...ticks]
} else {
ticks.push(item)
candleTick.value = [...ticks]
}
ema.value = calculateEMA(ticks, 20)
macd.value = calculateMACD(ticks)
bb.value = calculateBollingerBands(ticks)
rsi.value = calculateRSI(ticks)
// console.table(entrySignals(ticks))
console.log(swingSignal(ticks))
lazyLock.value = false
}
ema.value = calculateEMA(ticks, 20)
macd.value = calculateMACD(ticks)
bb.value = calculateBollingerBands(ticks)
lazyLock.value = false
})
}
@@ -233,23 +258,21 @@ const colorsTypeMap = {
const mouseMove = (data) => {
positionData.value = `
<span style="color:red; padding-right:3px;">O</span>${data.open}
<span style="color:red; padding-left:5px; padding-right:3px;">C</span>${data.close}
<span style="color:red; padding-left:5px; padding-right:3px;">L</span>${data.low}
<span style="color:red; padding-left:5px; padding-right:3px;">H</span>${data.high}
<span style="color:red; padding-left:5px; padding-right:3px;">T</span>${epochToString(data.time*1000)}
<span style="color:red; padding-right:3px;">O</span>${data == null ? 0 : data.open}
<span style="color:red; padding-left:5px; padding-right:3px;">C</span>${data == null ? 0 : data.close}
<span style="color:red; padding-left:5px; padding-right:3px;">L</span>${data == null ? 0 : data.low}
<span style="color:red; padding-left:5px; padding-right:3px;">H</span>${data == null ? 0 : data.high}
<span style="color:red; padding-left:5px; padding-right:3px;">T</span>${data == null ? 0 : epochToString(data.time*1000)}
`;
}
watch(contract, newVal => {
distroy()
console.log(newVal);
init(newVal, time.value)
})
watch(time, newVal => {
distroy()
console.log(newVal);
init(contract.value, newVal)
})
@@ -303,6 +326,7 @@ watch(time, newVal => {
:ema="ema"
:macd="macd"
:bb="bb"
:rsi="rsi"
:autosize="true"
:chart-options="chartOptions"
:ema-options="emaLineOptions"
@@ -313,6 +337,7 @@ watch(time, newVal => {
:lower-bb-options="lowerBbOptions"
:middle-bb-options="middleBbOptions"
:upper-bb-options="upperBbOptions"
:rsi-line-options="rsiLineOptions"
:lazyLock="lazyLock"
@lazyLoad="lazyLoad"
@mouseMove="mouseMove"