当点标记被禁用时，无法在高图中设置“选定”状态

Unable to set the Selected state in Highcharts, when point marker is disabled

本文关键字：高图中 设置 状态 选定      更新时间：2023-09-26

我试图在折线图中显示所选的点，即使点标记被禁用。但是，这行不通。有人能帮我一下吗?

这是Highcharts API文档的一个例子，我的要求是类似的

$(function () {
    $('#container').highcharts({
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },
        plotOptions: {
            series: {
                allowPointSelect: true,
                marker: {
                    enabled : false,
                    states: {
                        select: {
                            enabled: true
                        }
                    }
                }
            }
        },
        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
        }]
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 400px"></div>

解决方案1

设置"radius marker as 1"后选择"state works"。例如:http://jsfiddle.net/68ukq1hs/1

<标题>解决方案2 h1> 用标记，然后捕获特定点上的单击事件。下一步是在显示标记的点上调用point.update()。 
point:{
                events:{
                    click:function(){
                        var serie = this.series,
                            flag = this.marker && this.marker.enabled ? false : true;
                        
                        //remove old point
                        if(serie.prevPoint) {
                            serie.prevPoint.update({
                                marker:{
                                    enabled: false
                                }
                            },false);
                        }
                        
                        serie.prevPoint = this;
                        
                        this.update({
                            marker:{
                                enabled: flag
                            }
                        });
                    }
                }
            },

示例:http://jsfiddle.net/11pLzk9m/2/

相关文章：