Small stylistic changes to graph

This commit is contained in:
Matthias 2020-09-30 07:48:36 +02:00
parent 6379aa669a
commit 7703ee16fc
3 changed files with 14 additions and 11 deletions

View File

@ -187,16 +187,15 @@ export default class CandleChart extends Vue {
{
left: MARGINLEFT,
right: MARGINRIGHT,
// height: subplotCount === 0 ? '70%' : '60%',
// top: '0px',
// Grid Layout from bottom to top
bottom: `${subplotCount * 10 + 10}%`,
// bottom: '150px',
},
{
// Volume
left: MARGINLEFT,
right: MARGINRIGHT,
top: subplotCount === 0 ? '80%' : '70%',
// Grid Layout from bottom to top
bottom: `${subplotCount * 10}%`,
height: '10%',
},
],
@ -375,8 +374,8 @@ export default class CandleChart extends Vue {
options.grid.push({
left: MARGINLEFT,
right: MARGINRIGHT,
bottom: `${(plotIndex - 1) * 50}px`,
height: '8%',
bottom: `${plotIndex * 50}px`,
height: '50px',
});
}
Object.entries(value).forEach(([sk, sv]) => {
@ -418,7 +417,8 @@ export default class CandleChart extends Vue {
// options.xAxis[options.xAxis.length - 1].axisTick.show = true;
// }
if (options.grid && Array.isArray(options.grid)) {
options.grid[options.grid.length - 1].bottom = '75px';
// Last subplot is bottom
options.grid[options.grid.length - 1].bottom = '50px';
delete options.grid[options.grid.length - 1].top;
}

View File

@ -32,7 +32,7 @@
</div>
<div class="col-mb-2 mr-2">
<b-checkbox v-model="useUTC" title="Use UTC for graph">useUtc</b-checkbox>
<b-checkbox v-model="useUTC" title="Use UTC for graph">useUTC</b-checkbox>
</div>
<div class="col-mb-2 mr-1">
<b-button size="sm" title="Plot configurator" @click="showConfigurator">&#9881;</b-button>
@ -40,12 +40,14 @@
</div>
<div class="row mr-1 ml-1 h-100">
<CandleChart
v-if="hasDataset"
:dataset="dataset"
:trades="trades"
:plot-config="plotConfig"
:use-u-t-c="useUTC"
>
</CandleChart>
<label v-else style="margin: auto auto; font-size: 1.5rem">No data available</label>
</div>
</div>
</template>
@ -160,4 +162,4 @@ export default class CandleChartContainer extends Vue {
}
</script>
<style></style>
<style scoped></style>

View File

@ -31,6 +31,7 @@ import CandleChartContainer from '@/components/charts/CandleChartContainer.vue';
import TimeRangeSelect from '@/components/ftbot/TimeRangeSelect.vue';
import StrategyList from '@/components/ftbot/StrategyList.vue';
import { AvailablePairPayload, AvailablePairResult, WhitelistResponse } from '@/types';
import { BotStoreGetters } from '@/store/modules/ftbot';
const ftbot = namespace('ftbot');
@ -38,8 +39,6 @@ const ftbot = namespace('ftbot');
components: { CandleChartContainer, StrategyList, TimeRangeSelect },
})
export default class Graphs extends Vue {
timeframe = '5m';
historicView = false;
strategy = '';
@ -52,6 +51,8 @@ export default class Graphs extends Vue {
@ftbot.State trades;
@ftbot.Getter [BotStoreGetters.timeframe]!: string;
@ftbot.Action public getWhitelist!: () => Promise<WhitelistResponse>;
@ftbot.Action public getAvailablePairs!: (