Tabulator: linking to

[Diskovered]

Hi Oli,

I have two columns, one 'lat' and other 'lng'. I'd like to create links inside these cells with this format:

https://mapquest.com/latlng/<Lat/Lng coordinates>

When clicked, it targets the event/incident on the map. Do you know how I can create hyperlinks inside tabulator cells? Thanks

[olifolkerd]

Hey @Diskovered

You would need to create a custom formatter and assign it to the columns:

//Lat long link formatter
latLongFormatter = function(cell, formatterParams){
        //cell - the cell component
        //formatterParams - parameters set for the column

        var data = cell.getData();

        return "<a href='https://mapquest.com/latlng/" + data.lat + "/" + data.long + "'>" + cell.getValue() + "</a>";
}

//assign formatter in column definition
$("#example-table").tabulator({
    columns:[
        {title:"Lat", field:"lat", formatter:latLongFormatter},
        {title:"Long", field:"long", formatter:latLongFormatter},
    ]
});

Cheers

Oli

[Diskovered]

Thank you! It's working :)