I am using vis.js timeline in a Vue.js project. Although it seems pretty easy to customize the locale using vanilla javascript (see codepen and documentation), I just can't get it done with Vue. I have already added moment.js and moment-with-locales-es6 to my project. Is this the right way to apply the locale to moment.js so it also applies to vis timeline?
This is my vue.js component:
<template>
<div className="wrapper">
<div id="visualization"></div>
</div>
</template>
<script>
import {Timeline} from 'vis-timeline/standalone';
import tr from 'moment/locale/tr'
import moment from "moment-with-locales-es6";
export default {
data() {
return {
items: [
{
id: 1,
content: "1",
start: new Date(2021, 2, 23),
group: 0
},
options: {
locale: "tr",
locales: {
tr: {
current: "geçerli",
time: "kere",
},
},
},
timeline: null
}
},
mounted() {
this.timeline = new Timeline(document.getElementById('visualization'));
this.timeline.setOptions(this.options);
this.timeline.setItems(this.items);
moment.locale('tr')
}
}
</script>
I managed to do it by adding this to my index.html file:
<script src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/locale/tr.js'></script>
I am pretty sure there's a better solution for this...