Question

我正在使用highcharts导航器。我不需要启用rangeSelector，手柄，滚动条。我为导航器设计了一些样式。

我面临的问题是：当我将鼠标放在导航器上时，只要鼠标焦点在导航器中，我就会看到一个小的展开图标。有什么办法可以禁用它吗？

JSFiddle：http://jsfiddle.net/cbhrp4ao/4/。将鼠标指针放在导航器内部，可以看到扩展宽度图标。

HighCharts代码：

Highcharts.stockChart('container', {
      chart: {
        spacingTop: 170,
        spacingBottom: 20,
        type: 'line'
      },

      navigator: {
        enabled: true,
        top: -10,
        height: 50,
        tickAmount: 12,
        maskFill: 'rgba(0, 0, 255, 0.2)',
        outlineColor: 'transparent',
        handles: {
          enabled: false,
          backgroundColor: 'transparent',
          borderColor: 'transparent'
        },
        series: {
          lineColor: 'transparent',
          fillOpacity: 0
        },
        xAxis: {
          labels: {
            style: {
              color: '#000000',
              fontWeight: 'bold',
              fontSize: '14px'
            }
          }
        }
      },

    scrollbar: {
            enabled: false
        },

    rangeSelector: {
       enabled: false
    },

    series: [{
        name: 'USD to EUR',
        data: usdeur
    }]
});

Answer 1

您将需要使用CSS覆盖规则

.highcharts-navigator, .highcharts-navigator * {
  cursor : default !important
}

Fiddle

HighCharts导航器：如何在悬停时禁用扩展宽度图标

1 个答案: