Карта Highcharts не меняет цвет при наведении

Question

У меня есть следующие настройки на моей карте Highcharts, и когда я наводю курсор мыши на страну, она не использует цвет, и я не уверен почему. Все, что происходит, это то, что он меняет цвет на голубой.

Highcharts.mapChart('geo-graph', {
    series: [{
        states: {
            hover: {
                color: '#f47d25'
            }
        }
    }]
});

Вот полный JavaScript (он использует лезвие, поэтому {!! $geo !!} материал заменяется на JSON):

let data = JSON.parse('{!! $geo !!}');
Highcharts.mapChart('geo-graph', {
    title: {
        text: null
    },
    mapNavigation: {
        enabled: true
    },
    colorAxis: {
        min: 1,
        type: 'logarithmic'
    },
    legend: {
        layout: 'vertical',
        align: 'left',
        verticalAlign: 'bottom'
    },
    series: [{
        data: data,
        mapData: Highcharts.maps['custom/world'],
        joinBy: ['iso-a2', 'code'],
        name: 'Country',
        allowPointSelect: true,
        states: {
            hover: {
                color: '#f47d25'
            }
        }
    }]
});

Вот некоторые примеры данных:

[{
    code:"US",
    name:"United States", 
    value:1100
}]

Когда я делаю это на jsfiddle, он работает, но когда я собираю его с помощью gulp elixir, он не работает, может ли это быть проблемой?

gulp.task('default', function () {
    elixir.config.sourcemaps = false;
    elixir.config.production = true;
    elixir(function (mix) {
        mix.styles([
            './node_modules/highcharts/css/highcharts.css'
        ], 'public/css/highcharts.css');
        mix.scripts([
            './node_modules/highcharts/js/highcharts.js',
            './node_modules/highcharts/js/modules/exporting.js',
            './node_modules/highcharts/js/modules/map.js',
            './node_modules/highcharts/js/modules/data.js'
        ], 'public/js/highcharts.js');
    });
});

Answer 1

Добавление этого CSS работает для меня.

path:hover {
  fill: rgba(249, 209, 12, 0.87);
}