Javascript Highcharts-更改悬停点的颜色

因此，我已经在看highcharts API，在悬停图表时，可以选择更改点背景色的颜色

这是我当前的图表：

以及守则：

$(function () {
            $('#main-chart').highcharts({
                chart: {
                    type: 'area'
                },
                plotBorderColor: '#000000',
                plotBackgroundColor: '#000000',
                title: {
                    text: ''
                },
                subtitle: {
                    text: ''
                },
                xAxis: {
                    allowDecimals: false,
                    labels: {
                        formatter: function () {
                            return this.value; // clean, unformatted number for year
                        }
                    }
                },
                yAxis: {
                    title: {
                        text: 'Number of Clicks'
                    },
                    labels: {
                        formatter: function () {
                            return this.value / 1000 + 'k';
                        }
                    }
                },
                tooltip: {
                    pointFormat: '{series.name} produced <b>{point.y:,.0f}</b><br/>warheads in {point.x}'
                },
                plotOptions: {
                    area: {
                        pointStart: 1940,
                        marker: {
                            enabled: false,
                            symbol: 'circle',
                            radius: 2,
                            states: {
                                hover: {
                                    enabled: true
                                }
                            }
                        }
                    }
                },
                series: [{
                    name: 'USA',
                    lineColor: '#4adefa',
                    color: '#f1faf7',
                    data: [251, 122, 511, 424, 291, 426, 121, 342, 110, 235, 369, 640,250]


                }, {
                    name: 'USSR/Russia',
                    lineColor: '#44d99f',
                    color: '#f1faf7',
                    data: [215, 125, 450, 120, 150, 200, 426, 660, 869, 1060, 900, 340, 429]
                }]
            });
        });

$（函数（）{
$（“#主图表”）。高图({
图表：{
类型：“区域”
},
plotBorderColor:“#000000”，
plotBackgroundColor:“#000000”，
标题：{
文本：“”
},
副标题:{
文本：“”
},
xAxis：{
allowDecimals:false，
标签：{
格式化程序：函数（）{
返回this.value；//年份的干净、未格式化的数字
}
}
},
亚克斯：{
标题：{
文本：“点击次数”
},
标签：{
格式化程序：函数（）{
返回此值/1000+'k'；
}
}
},
工具提示：{
pointFormat:“{series.name}在{point.x}中生成{point.y:，.0f}
弹头”
},
打印选项：{
面积：{
起点：1940年，
标记：{
启用：false，
符号：'圆'，
半径：2，
国家：{
悬停：{
已启用：true
}
}
}
}
},
系列：[{
名称：'美国'，
线条颜色：“#4adefa”，
颜色：“#f1faf7”，
数据：[251、122、511、424、291、426、121、342、110、235、369、640250]
}, {
名称：“苏联/俄罗斯”，
线条颜色：“#44d99f”，
颜色：“#f1faf7”，
数据：[215125450120150200426608691060900340429]
}]
});
});

当在图表上悬停时，“点标记”是一个圆形的灰色圆圈-我想将其更改为一个带有白色背景和绿色边框的圆形

---

这可能吗？

您可以这样更改标记的颜色：

...  
marker: {
    fillColor: 'green',
    ...

 series: [{
                name: 'USA',
                lineColor: '#4adefa',
                color: '#f1faf7',
                marker: {
                        enabled: false,
                        symbol: 'circle',
                        radius: 2,
                        states: {
                            hover: {
                                fillColor: 'white',
                                lineColor: 'green',
                                lineWidth: 0
                            }
                        }
                    },
                data: [251, 122, 511, 424, 291, 426, 121, 342, 110, 235, 369, 640,250]
               // other series here.

            }

---

编辑：

如果希望每个系列的点样式相同，可以将其添加到

绘图选项中

              marker: {
                        enabled: false,
                        symbol: 'circle',
                        radius: 2,
                        states: {
                            hover: {
                                fillColor: 'white',
                                lineColor: 'green',
                                lineWidth: 0
                            }
                        }
                    }

可以在此处找到一把工作小提琴：

如果希望每个系列的点样式不同，可以为每个系列设置
marker.states.hover
属性，如下所示：

...  
marker: {
    fillColor: 'green',
    ...

 series: [{
                name: 'USA',
                lineColor: '#4adefa',
                color: '#f1faf7',
                marker: {
                        enabled: false,
                        symbol: 'circle',
                        radius: 2,
                        states: {
                            hover: {
                                fillColor: 'white',
                                lineColor: 'green',
                                lineWidth: 0
                            }
                        }
                    },
                data: [251, 122, 511, 424, 291, 426, 121, 342, 110, 235, 369, 640,250]
               // other series here.

            }

请参见此处的小提琴。
悬停指针的不同标记颜色

 data: [
                         { name: 'Point 1',color: '#4adefa', y: 251 }, 
                        { name: 'Point 2',color: '#000000', y: 122 },
                        { name: 'Point 3',color: '#A25429', y: 511 },
                        { name: 'Point 4',color: '#AA1111', y: 524 },
                        { name: 'Point 5',color: '#DF2500', y: 291 },
                        { name: 'Point 6',color: '#007ACF', y: 342 },
                        { name: 'Point 7',color: '#ECD66E', y: 110 },

                       ]

请参见此处的fiddle:
请发布主题对象。您可以为每个系列使用不同的标记颜色吗？是的，将标记配置放入每个系列中，如下所示：
。。。系列：[{name:'USA'，marker:{fillColor:'#f00'}，…