antvis/G2

Do you want to work on this issue?
You can request for a bounty in order to promote it!
复合图下多个Y轴的实现问题 #6085
Lee94 posted onGitHub
问题描述
用下面配置,第一次渲染右值轴感觉有问题,点下图例后正常。另外复合图多Y轴有其他思路嘛
{
type: "facetRect",
data: {
type: "inline",
value: [
{
门店名称: "宜兴店",
商品类别: "手机",
商品名称: "华为 HUAWEI P30天空之境全网通手机",
销售额: 72896,
销售数量: 17,
key: "宜兴店-手机-华为 HUAWEI P30天空之境全网通手机",
color: "华为 HUAWEI P30天空之境全网通手机",
},
{
门店名称: "宜兴店",
商品类别: "电脑整机",
商品名称: "Apple iPad Air 3 深空灰色",
销售额: 19440,
销售数量: 5,
key: "宜兴店-电脑整机-Apple iPad Air 3 深空灰色",
color: "Apple iPad Air 3 深空灰色",
},
{
门店名称: "江阴店",
商品类别: "影音娱乐",
商品名称: "小米(MI)小米AI音箱",
销售额: 916,
销售数量: 4,
key: "江阴店-影音娱乐-小米(MI)小米AI音箱",
color: "小米(MI)小米AI音箱",
},
{
门店名称: "江阴店",
商品类别: "手机",
商品名称: "华为 HUAWEI P30天空之境全网通手机",
销售额: 38592,
销售数量: 9,
key: "江阴店-手机-华为 HUAWEI P30天空之境全网通手机",
color: "华为 HUAWEI P30天空之境全网通手机",
},
{
门店名称: "江阴店",
商品类别: "电脑整机",
商品名称: "Apple iPad Air 3 深空灰色",
销售额: 50544,
销售数量: 13,
key: "江阴店-电脑整机-Apple iPad Air 3 深空灰色",
color: "Apple iPad Air 3 深空灰色",
},
],
},
width: 800,
height: 600,
paddingLeft: 100,
paddingRight: 100,
encode: { x: "key" },
children: [
{
type: "view",
// frame: false,
// viewStyle: {
// plotStrokeWidth: 0
// },
children: [
{
type: "interval",
encode: {
y: "销售额",
color: "color",
series: () => "销售额",
},
scale: {
y: {
independent: true,
domainMax: 80000,
},
},
axis: { y: { position: "left" } },
},
{
type: "interval",
encode: {
y: "销售数量",
color: "color",
series: () => "销售数量",
},
scale: {
y: {
independent: true,
domainMax: 20,
},
},
axis: { y: { position: "right", titleFill: "red" } },
},
],
},
],
}
重现链接
No response
重现步骤
No response
预期行为
No response
平台
- 操作系统: [macOS, Windows, Linux, React Native ...]
- 网页浏览器: [Google Chrome, Safari, Firefox]
屏幕截图或视频(可选)
No response
补充说明(可选)
No response