Plotly.js hover change color of element

Question

I'm working with plotly.js to make a simple world map with some lines on it. The data is simply a csv of latitudes and longitudes, count is nothing important.

Plotly.d3.csv('edgel_latlon.csv', function(err, rows){
    function unpack(rows, key) {
        return rows.map(function(row) { return row[key]; });}

function getMaxOfArray(numArray) {
    return Math.max.apply(null, numArray);
}

var data = [];
var count = unpack(rows, 'To');
var startLongitude = unpack(rows, 'lon1');
var endLongitude = unpack(rows, 'lon2');
var startLat = unpack(rows, 'lat1');
var endLat = unpack(rows, 'lat2');

for ( var i = 0 ; i < count.length; i++ ) {
    var opacityValue = count[i]/getMaxOfArray(count);

    var result = {
        type: 'scattergeo',
        locationmode: 'world',
        lon: [ startLongitude[i] , endLongitude[i] ],
        lat: [ startLat[i] , endLat[i] ],
        mode: 'lines',
        line: {
            width: .5,
            color: 'red'
        },
        opacity: 1
    };

    data.push(result);
};

var layout = {
    title: 'Title',
    showlegend: false,
    geo:{
        resolution:1000,
        scope: 'world',
        projection: {
            type: 'mercator'
        },
        showland: true,
        showcountries: true,
        landcolor: 'rgb(243,243,243)',
        countrycolor: 'rgb(0,0,0)'
    }
};

Plotly.plot(myDiv, data, layout, {showLink: false});

});

When I hover over a line on the map I would like the line to change from the color red to blue, but have no idea how to do this with plotly. Either you can't use the standard D3 methods to access the line or I'm missing something obvious. Thanks!