lychiyu/frequi_origin
1
0
Fork 0
mirror of https://github.com/freqtrade/frequi.git synced 2024-11-10 10:21:55 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add historic view

Browse Source
This commit is contained in:
Matthias 2020-07-02 19:58:06 +02:00
parent de4ed9a20f
commit 5e8923f746
4 changed files with 89 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
src/components/ftbot/CandleChart.vue
View File

@ -75,8 +75,8 @@ export default class CandleChart extends Vue {
const colLow = this.dataset.columns.findIndex((el) => el === 'low');
const colClose = this.dataset.columns.findIndex((el) => el === 'close');
const colVolume = this.dataset.columns.findIndex((el) => el === 'volume');
const colBuy = this.dataset.columns.findIndex((el) => el === 'buy');
const colSell = this.dataset.columns.findIndex((el) => el === 'sell');
const colBuyData = this.dataset.columns.findIndex((el) => el === '_buy_signal_open');
const colSellData = this.dataset.columns.findIndex((el) => el === '_sell_signal_open');
// Plot data
const options: echarts.EChartOption = {
@ -237,7 +237,6 @@ export default class CandleChart extends Vue {
type: 'scatter',
symbol: 'triangle',
symbolSize: 8,
data: this.buyData,
xAxisIndex: 0,
yAxisIndex: 0,
itemStyle: {
@ -245,13 +244,12 @@ export default class CandleChart extends Vue {
},
encode: {
x: 0,
y: 1,
y: colBuyData,
},
},
{
name: 'Sell',
type: 'scatter',
data: this.sellData,
symbol: 'diamond',
symbolSize: 8,
xAxisIndex: 0,
@ -261,13 +259,13 @@ export default class CandleChart extends Vue {
},
encode: {
x: 0,
y: 1,
y: colSellData,
},
},
],
};
this.createSignalData(colDate, colOpen, colBuy, colSell);
// this.createSignalData(colDate, colOpen, colBuy, colSell);
// This will be merged into final plot config
// const subPlots = {
@ -386,21 +384,21 @@ export default class CandleChart extends Vue {
return options;
}
createSignalData(colDate: number, colOpen: number, colBuy: number, colSell: number): void {
// Calculate Buy and sell Series
if (!this.signalsCalculated) {
// Generate Buy and sell array (using open rate to display marker)
for (let i = 0, len = this.dataset.data.length; i < len; i += 1) {
if (this.dataset.data[i][colBuy] === 1) {
this.buyData.push([this.dataset.data[i][colDate], this.dataset.data[i][colOpen]]);
}
if (this.dataset.data[i][colSell] === 1) {
this.sellData.push([this.dataset.data[i][colDate], this.dataset.data[i][colOpen]]);
}
}
this.signalsCalculated = true;
}
}
// createSignalData(colDate: number, colOpen: number, colBuy: number, colSell: number): void {
// Calculate Buy and sell Series
// if (!this.signalsCalculated) {
// // Generate Buy and sell array (using open rate to display marker)
// for (let i = 0, len = this.dataset.data.length; i < len; i += 1) {
// if (this.dataset.data[i][colBuy] === 1) {
// this.buyData.push([this.dataset.data[i][colDate], this.dataset.data[i][colOpen]]);
// }
// if (this.dataset.data[i][colSell] === 1) {
// this.sellData.push([this.dataset.data[i][colDate], this.dataset.data[i][colOpen]]);
// }
// }
// this.signalsCalculated = true;
// }
// }
}
</script>

34
src/store/modules/ftbot.ts
View File

@ -6,6 +6,7 @@ import {
Logs,
DailyPayload,
Trade,
PairCandlePayload,
PairHistoryPayload,
PlotConfig,
EMPTY_PLOTCONFIG,
@ -38,6 +39,7 @@ export default {
pairlistMethods: [],
detailTradeId: null,
candleData: {},
history: {},
plotConfig: {},
customPlotConfig: { ...EMPTY_PLOTCONFIG },
},
@ -98,6 +100,10 @@ export default {
updatePairCandles(state, { pair, timeframe, data }) {
state.candleData = { ...state.candleData, [`${pair}__${timeframe}`]: data };
},
updatePairHistory(state, { pair, timeframe, data }) {
// Intentionally drop the previous state here.
state.history = { [`${pair}__${timeframe}`]: data };
},
updatePlotConfig(state, plotConfig: PlotConfig) {
state.plotConfig = plotConfig;
},
@ -133,11 +139,11 @@ export default {
.then((result) => commit('updateOpenTrades', result.data))
.catch(console.error);
},
getPairCandles({ commit }, payload: PairHistoryPayload) {
getPairCandles({ commit }, payload: PairCandlePayload) {
if (payload.pair && payload.timeframe && payload.limit) {
return api
.get('/pair_candles', {
params: { pair: payload.pair, timeframe: payload.timeframe, limit: payload.limit },
params: { ...payload },
})
.then((result) => {
commit('updatePairCandles', {
@ -155,6 +161,30 @@ export default {
reject(error);
});
},
getPairHistory({ commit }, payload: PairHistoryPayload) {
if (payload.pair && payload.timeframe && payload.limit && payload.timerange) {
return api
.get('/pair_history', {
params: { ...payload },
timeout: 10000,
})
.then((result) => {
commit('updatePairHistory', {
pair: payload.pair,
timeframe: payload.timeframe,
timerange: payload.timerange,
data: result.data,
});
})
.catch(console.error);
}
// Error branchs
const error = 'pair or timeframe or timerange not specified';
console.error(error);
return new Promise((resolve, reject) => {
reject(error);
});
},
getPlotConfig({ commit }) {
return api
.get('/plot_config')

7
src/types/types.ts
View File

@ -138,13 +138,18 @@ export interface ClosedTrade extends Trade {
open_order_id?: string;
}
export interface PairHistoryPayload {
export interface PairCandlePayload {
pair: string;
timeframe: string;
limit: number;
}
export interface PairHistoryPayload extends PairCandlePayload {
timerange: string;
}
export interface PairHistory {
pair: string;
columns: string[];
data: number[];
length: number;

34
src/views/Graphs.vue
View File

@ -1,6 +1,10 @@
<template>
<div class="container-fluid">
<div class="row mb-2">
<div class="col-mb-2">
<b-checkbox v-model="historicView">HistoricData</b-checkbox>
<b-button @click="refresh">&#x21bb;</b-button>
</div>
<div class="col-mb-2">
<b-form-select :options="whitelist" v-model="pair" @change="refresh"> </b-form-select>
</div>
@ -38,7 +42,12 @@ import { Component, Vue } from 'vue-property-decorator';
import { namespace } from 'vuex-class';
import CandleChart from '@/components/ftbot/CandleChart.vue';
import PlotConfigurator from '@/components/ftbot/PlotConfigurator.vue';
import { PlotConfig, EMPTY_PLOTCONFIG } from '../store/types';
import {
PlotConfig,
EMPTY_PLOTCONFIG,
PairCandlePayload,
PairHistoryPayload,
} from '../store/types';
import { loadCustomPlotConfig } from '../shared/storage';
const ftbot = namespace('ftbot');
@ -55,18 +64,25 @@ export default class Graphs extends Vue {
plotOption = 'main_plot';
historicView = false;
// Custom plot config - manually changed by user.
// eslint-disable-next-line @typescript-eslint/camelcase
customPlotConfig: PlotConfig = { ...EMPTY_PLOTCONFIG };
@ftbot.State candleData;
@ftbot.State history;
@ftbot.State whitelist;
@ftbot.State plotConfig;
@ftbot.Action
public getPairCandles;
public getPairCandles!: (payload: PairCandlePayload) => void;
@ftbot.Action
public getPairHistory!: (payload: PairHistoryPayload) => void;
@ftbot.Action
public getWhitelist;
@ -86,6 +102,9 @@ export default class Graphs extends Vue {
}
get dataset() {
if (this.historicView) {
return this.history[`${this.pair}__${this.timeframe}`];
}
return this.candleData[`${this.pair}__${this.timeframe}`];
}
@ -98,7 +117,16 @@ export default class Graphs extends Vue {
}
refresh() {
this.getPairCandles({ pair: this.pair, timeframe: this.timeframe, limit: 500 });
if (this.historicView) {
this.getPairHistory({
pair: this.pair,
timeframe: this.timeframe,
limit: 500,
timerange: '20200101-20200201',
});
} else {
this.getPairCandles({ pair: this.pair, timeframe: this.timeframe, limit: 500 });
}
this.getPlotConfig();
}