ウィルRollason:
私はAPIからこのようなデータを受信します
{
"Bob Knight": 30774.72000002,
"Samuel Herman": 10310.61000004,
"Lucie Perry": 26308.41,
"Andreas Smith": 8960.189999999999,
"Frederic Smith": 2029.5000000599998,
}
私のアプリが、私は何も表示に頂点を取得するための正しい方法でデータをフォーマットすることができないように反応して、私は頂点のチャートを使用して棒グラフでこれを表示しようとしています。私はこのようなJavaScriptで書式設定しようとしています:
{
{x: "Bob Knight", y:"30774.720002"},
...
}
それは何もレンダリングされません。しかし、ドキュメントが示唆するものと思われます。以下は私のコンポーネントの耐用ビットであり、
constructor(props) {
super(props);
this.state = {
options: {
chart: {
id: "basic-bar"
},
xaxis: {
type: 'category'
}
},
values: []
}
}
componentDidUpdate(prevProps) {
if (!equal(this.props.selectedDate, prevProps.selectedDate))
{
var m = moment(this.props.selectedDate).format("M");
var y = moment(this.props.selectedDate).format("YYYY");
axios.get('http://localhost:8080/opportunity/owner/' + y + '/' + m)
.then(res => {
values = res.data;
this.setState({
values
})
})
.catch(console.log)
}
}
render(
<Chart series = {this.state.values} type ='bar' options ={this.state.options}/>
オイゲンSunic:
const obj = {
"Bob Knight": 30774.72000002,
"Samuel Herman": 10310.61000004,
"Lucie Perry": 26308.41,
"Andreas Smith": 8960.189999999999,
"Frederic Smith": 2029.5000000599998,
}
const arr = Object.entries(obj).map(x => ({
'x': x[0],
'y': x[1]
}))
console.log(arr)