Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] 在渐变面积图中,tooltip 条目上的 shape 没有区分分组渐变色 #1442

Closed
kkxxkk2019 opened this issue Nov 8, 2023 · 0 comments · Fixed by #1468
Closed
Assignees
Labels
bug Something isn't working

Comments

@kkxxkk2019
Copy link
Collaborator

Version

latest

Link to Minimal Reproduction

none

Steps to Reproduce

{
        "type": "area",
        "data": {
          "values": [
            {
              "month": "1月",
              "kit": "套件1",
              "sales": 8
            },
            {
              "month": "1月",
              "kit": "套件2",
              "sales": 10
            },
            {
              "month": "2月",
              "kit": "套件1",
              "sales": 11
            },
            {
              "month": "2月",
              "kit": "套件2",
              "sales": 12
            },
            {
              "month": "3月",
              "kit": "套件1",
              "sales": 13
            },
            {
              "month": "3月",
              "kit": "套件2",
              "sales": 14
            },
            {
              "month": "4月",
              "kit": "套件1",
              "sales": 11
            },
            {
              "month": "4月",
              "kit": "套件2",
              "sales": 12
            },
            {
              "month": "5月",
              "kit": "套件1",
              "sales": 20
            },
            {
              "month": "5月",
              "kit": "套件2",
              "sales": 21
            },
            {
              "month": "6月",
              "kit": "套件1",
              "sales": 11
            },
            {
              "month": "6月",
              "kit": "套件2",
              "sales": 22
            },
            {
              "month": "7月",
              "kit": "套件1",
              "sales": 23
            },
            {
              "month": "7月",
              "kit": "套件2",
              "sales": 18
            },
            {
              "month": "8月",
              "kit": "套件1",
              "sales": 30
            },
            {
              "month": "8月",
              "kit": "套件2",
              "sales": 33
            },
            {
              "month": "9月",
              "kit": "套件1",
              "sales": 23
            },
            {
              "month": "9月",
              "kit": "套件2",
              "sales": 18
            },
            {
              "month": "10月",
              "kit": "套件1",
              "sales": 30
            },
            {
              "month": "10月",
              "kit": "套件2",
              "sales": 33
            }
          ]
        },
        "xField": "month",
        "yField": "sales",
        "seriesField": "kit",
        "point": {
          "style": {
            "size": 0
          },
          "state": {
            "dimension_hover": {
              "size": 10,
              "lineWidth": 0
            }
          }
        },
        "area": {
          "style": {
            "fill": {
              "gradient": "linear",
              "x0": 0.5,
              "y0": 0,
              "x1": 0.5,
              "y1": 1,
              "stops": [
                {
                  "offset": 0,
                  "opacity": 1
                },
                {
                  "offset": 1,
                  "opacity": 0.2
                }
              ]
            }
          }
        },
        "axes": [
          {
            "orient": "left",
            "label": {
              "inside": true,
              "space": 0,
              "style": {
                "textBaseline": "top",
                "dy": 4,
                "fontSize": 12,
                "fill": "#8F959E"
              }
            },
            "grid": {
              "style": {
                "lineDash": [0, 0]
              }
            },
            "title": {
              "visible": true,
              "position": "start",
              "autoRotate": false,
              "text": "单位",
              "space": 0,
              "style": {
                "textAlign": "start",
                "dy": -12,
                "lineHeight": 12,
                "fill": "#8F959E"
              }
            }
          },
          {
            "orient": "bottom",
            "maxHeight": 60,
            "tick": {
              "visible": false,
              "tickSize": 4,
              "style": {
                "lineWidth": 1,
                "stroke": "#dee0e3",
                "strokeOpacity": 1
              }
            },
            "paddingOuter": 1.5,
            "sampling": false,
            "label": {
              "autoRotate": true,
              "autoRotateAngle": [0, 5, 10, 15, 20, 30, 45],
              "autoLimit": true,
              "autoHide": true,
              "autoHideSeparation": 8,
              "style": {
                "fontSize": 12
              }
            }
          }
        ],
        "padding": {
          "top": 0,
          "left": 0,
          "right": 0,
          "bottom": 0
        },
        "legends": {
          "visible": true,
          "orient": "top",
          "position": "start",
          "maxRow": 1,
          "padding": {
            "top": 0,
            "right": 0,
            "left": 0,
            "bottom": 30
          }
        },
        "label": {
          "visible": false
        },
        "crosshair": {
          "xField": {
            "visible": true,
            "label": {
              "visible": false
            }
          }
        },
        "theme": {
          "component": {
            "discreteLegend": {
              "pager": {
                "padding": {
                  "left": 0,
                  "right": 0,
                  "top": 0,
                  "bottom": 0
                }
              }
            }
          },
          "colorScheme": {
            "default": {
              "dataScheme": [
                {
                  "maxDomainLength": 15,
                  "scheme": [
                    "#3370EB",
                    "#25B2E5",
                    "#17CFB5",
                    "#0EAD97",
                    "#9E73EB",
                    "#8A5BDE",
                    "#B791FA",
                    "#51C3F0",
                    "#1099CC",
                    "#09917F",
                    "#51BA43",
                    "#419E34",
                    "#8FB4FF",
                    "#528CFF",
                    "#2353B6"
                  ]
                }
              ]
            }
          }
        }
      }

Current Behavior

img_v3_024v_fe759364-3053-4535-8356-f23f8f77ae0g

Expected Behavior

同对应面积的颜色

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants