You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

已设置tooltip.split为true,为何悬停时仅显示单个标签?

图表Tooltip效果对比
  • 期望效果:实现Highcharts官方的拆分式Tooltip,每个系列的数据条目单独分行展示,左侧显示系列名称,右侧对应数据值
  • 当前实现:我的图表Tooltip未达到上述拆分式布局效果

Highcharts配置代码

Highcharts.chart('container', {
    "accessibility": {
        "enabled": false
    },
    "credits": {
        "enabled": false
    },
    "title": {
        "text": "水果",
        "margin": 50,
    },
    "tooltip": {
        "split": true,
        "outside": true
    },
    "boost": {
        "useGPUTranslations": false,
        "seriesThreshold": 1,
        "enabled": true
    },
    "chart": {
        "spacingRight": 15,
        "spacingLeft": 5,
        "marginTop": 60,
        "width": 200,
        "zooming": {
            "mouseWheel": {
                "enabled": true
            },
            "type": "y"
        },
        "marginBottom": 100,
        "events": {}
    },
    "legend": {
        "width": 200,
        "maxHeight": 100,
        "x": 15,
    },
    "xAxis": {
        "minorTicks": true,
        "crosshair": {
            "snap": false
        },
        "maxPadding": 0,
        "minPadding": 0,
        "title": {
            "offset": 7,
            "style": {
                "fontSize": "11px"
            }
        },
        "labels": {
            "y": -7,
        },
        "tickLength": 0,
        "endOnTick": true,
        "lineWidth": 0,
        "startOnTick": true,
        "tickAmount": 2,
        "minorTickInterval": "auto",
        "tickPositions": [
            0,
            150
        ],
        "min": 0,
        "max": 150,
        "reversed": false,
        "opposite": true,
        "gridLineWidth": 0,
        "minRange": 0.1,
        "type": "linear"
    },
    "yAxis": {
        "min": 1067.62296,
        "max": 1097.18856,
        "minorTicks": true,
        "reversed": true,
        "crosshair": {
            "snap": false
        },
        "title": {
            "text": null
        },
        "maxPadding": 0,
        "minPadding": 0,
        "events": {},
        "labels": {
            "padding": 0,
            "rotation": -90,
            "format": "{value}",
        },
        "plotLines": []
    },
    "annotations": [],
    "exporting": {
        "enabled": false
    },
    "plotOptions": {
        "series": {
            "cursor": "pointer",
            "connectNulls": false,
            "findNearestPointBy": "xy",
            "pointStart": null,
            "allowPointSelect": true,
            "stickyTracking": false,
            "turboThreshold": 0,
            "events": {},
            "point": {
                "events": {}
            }
        }
    },
    "series": [
        {
            "id": "apples",
            "cropThreshold": 999999999,
            "data": [
                [
                    139.1992,
                    1067.62296
                ],
                [
                    103.4107,
                    1081.85712
                ],
                [
                    93.0917,
                    1097.18856
                ]
            ],
            "name": "苹果",
            "lineWidth": 0.5,
            "visible": true,
            "allowPointSelect": true
        },
        {
            "id": "oranges",
            "cropThreshold": 999999999,
            "data": [
                [
                    103.4093,
                    1067.62296
                ],
                [
                    134.8164,
                    1082.71056
                ],
                [
                    48.788,
                    1097.18856
                ]
            ],
            "name": "橙子",
            "lineWidth": 0.5,
            "visible": true,
            "allowPointSelect": true
        },
        {
            "id": "grapes",
            "cropThreshold": 999999999,
            "data": [
                [
                    105.3344,
                    1067.62296
                ],
                [
                    103.497,
                    1079.96736
                ],
                [
                    98.965,
                    1097.18856
                ]
            ],
            "name": "葡萄",
            "lineWidth": 0.5,
            "visible": true,
            "allowPointSelect": true
        }
    ]
});

内容的提问来源于stack exchange,提问作者ryan

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.25 02:57:02