G2Plot图表堆栈错误列
G2Plot chart stack wrong column
编辑:添加一个片段,代码如下:
<div id="app"></div>
<script src="https://unpkg.com/@antv/g2plot@latest/dist/g2plot.js"></script>
<script>
const plot = new G2Plot.Column(document.getElementById('app'), {
data: [
{
day: 9,
amount: 11104.37
},
{
day: 10,
amount: 11244.82
},
{
day: 11,
amount: 10286.14
},
{
day: 12,
amount: 7485.57
},
{
day: 1,
amount: 9274.57
},
{
day: 2,
amount: 8899.95
}
],
xField: 'day',
yField: 'amount'
});
plot.render();
</script>
我尝试使用 Ant 的 G2Plot,但遇到了一些问题。
我的目标是显示柱形图。
这是我的 G2Plot 配置:
const columnPlotConfig = {
data: [
{
day: 9,
amount: 11104.37
},
{
day: 10,
amount: 11244.82
},
{
day: 11,
amount: 10286.14
},
{
day: 12,
amount: 7485.57
},
{
day: 1,
amount: 9274.57
},
{
day: 2,
amount: 8899.95
}
],
xField: 'day',
yField: 'amount'
};
但是一些数据列相互堆叠,使它们的“位置”空着(见下面的屏幕截图)
我发现 xField
需要 字符串值
<div id="app"></div>
<script src="https://unpkg.com/@antv/g2plot@latest/dist/g2plot.js"></script>
<script>
const plot = new G2Plot.Column(document.getElementById('app'), {
data: [
{
day: "9",
amount: 11104.37
},
{
day: "10",
amount: 11244.82
},
{
day: "11",
amount: 10286.14
},
{
day: "12",
amount: 7485.57
},
{
day: "1",
amount: 9274.57
},
{
day: "2",
amount: 8899.95
}
],
xField: 'day',
yField: 'amount'
});
plot.render();
</script>
编辑:添加一个片段,代码如下:
<div id="app"></div>
<script src="https://unpkg.com/@antv/g2plot@latest/dist/g2plot.js"></script>
<script>
const plot = new G2Plot.Column(document.getElementById('app'), {
data: [
{
day: 9,
amount: 11104.37
},
{
day: 10,
amount: 11244.82
},
{
day: 11,
amount: 10286.14
},
{
day: 12,
amount: 7485.57
},
{
day: 1,
amount: 9274.57
},
{
day: 2,
amount: 8899.95
}
],
xField: 'day',
yField: 'amount'
});
plot.render();
</script>
我尝试使用 Ant 的 G2Plot,但遇到了一些问题。 我的目标是显示柱形图。
这是我的 G2Plot 配置:
const columnPlotConfig = {
data: [
{
day: 9,
amount: 11104.37
},
{
day: 10,
amount: 11244.82
},
{
day: 11,
amount: 10286.14
},
{
day: 12,
amount: 7485.57
},
{
day: 1,
amount: 9274.57
},
{
day: 2,
amount: 8899.95
}
],
xField: 'day',
yField: 'amount'
};
但是一些数据列相互堆叠,使它们的“位置”空着(见下面的屏幕截图)
我发现 xField
需要 字符串值
<div id="app"></div>
<script src="https://unpkg.com/@antv/g2plot@latest/dist/g2plot.js"></script>
<script>
const plot = new G2Plot.Column(document.getElementById('app'), {
data: [
{
day: "9",
amount: 11104.37
},
{
day: "10",
amount: 11244.82
},
{
day: "11",
amount: 10286.14
},
{
day: "12",
amount: 7485.57
},
{
day: "1",
amount: 9274.57
},
{
day: "2",
amount: 8899.95
}
],
xField: 'day',
yField: 'amount'
});
plot.render();
</script>