Я пытаюсь отразить vue -карту js точечного графика в laravel и создать точки на основе ответа json, полученного от вызова топора ios. Я хочу начать с того, что вызов ax ios возвращает объект JSON, подобный этому, с 313 записями:
{"0":{"att1":106620276,"arr2":"https://somesite.com/somelink/5846/106620276","att3":2,"att4":1 ...}}
Это код, который я использую, чтобы попытаться поместить его в график рассеяния.
<script>
import { Scatter } from 'vue-chartjs'
export default {
extends: Scatter,
name: "MyScatter",
data: () => ({
test: [],
myobjs: []
}),
mounted() {
this.getData(),
this.renderChart({
scales: {
yAxes: [{
ticks: {
stepSize: 10,
maxTicksLimit: 35
}
}]
},
datasets: [{
label: 'Scatter dataset 1',
fill: false,
borderColor: '#f87979',
backgroundColor: '#f87979',
data: this.myobjs
}
]
}, {responsive: true, maintainAspectRatio: false})
},
methods: {
getData() {
this.axios.get('/[my route]')
.then(
response => {
this.test = response.data;
let len = this.test.length;
console.log('data test:' + parseFloat(this.test[0].att3)) //works
console.log('props: ' + len); // works correctly returns 313
this.test.forEach(el => {
this.myobjs.push( { x: parseFloat(el.att3), y: parseFloat(el.att4) } );
});
});
}
},
computed: {
}
}
</script>
<style scoped>
</style>
Я последовательно получаю следующее, с целой кучей точек, по-видимому, в (0, 0):
Как мне исправить это и правильно отобразить диаграмму?