当禁用点标记时,无法在Highcharts中设置选定状态

问题描述 投票:1回答:1

我试图将折线图中的点显示为选定状态,即使禁用了点标记。但是,它不起作用。有人可以帮我吗?

这是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>
javascript highcharts
1个回答
2
投票

解决方案1

您可以设置radius marker as 1,然后选择状态。例如:http://jsfiddle.net/68ukq1hs/1

解决方案2

禁用标记,然后在特定点捕获点击事件。下一步是在point上调用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/

© www.soinside.com 2019 - 2024. All rights reserved.