Range slider on additional parameters

Is it possible to pass parameters that are not used for axes as the basis of the range selector? I am plotting sources as a function of position, for example, but they have an additional parameter of age that is stored in either customdata or meta keywords. Is it possible to interactively select which age range to display?

I tried a regular slider, but while it does work to control multiple traces, I can get it to work only on either the minimum or the maximum values, I can’t get it to control both. And I have tried dash and widgets, but I need to be able to export a functioning html that doesn’t depend on a python interface, so that option isn’t feasible.

I have considered introducing a separate javascript slider but I am somewhat lost on how to connect it to the graph.

Nevernind, got it to work in external javascript. If someone needs it:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.0/css/ion.rangeSlider.min.css"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
    	skin: "modern",
        type: "double",
        min: 7,
        max: 10,
        from: 7,
        to: 10,
        grid: true,
        onChange: function () {
        	var $inp = $(this)
            var from = $inp.data("from")
            var to = $inp.data("to")

var gd = document.getElementById('2a7b4f81-1b13-44e3-a848-33846e1c6a3e')
        var ages=[];
        for(i = 0; i < gd.data.length; i++){ages.push(gd.data[i].customdata[0])}
        $("#js-range-slider").on("change", function () {
        var $inp = $(this);
        var from = $inp.data("from");   // input data-from attribute
        var to = $inp.data("to");       // input data-to attribute

    	var i,v,vv=[];
    	for(i = 0; i < gd.data.length; i++){
    		vv.push((ages[i]>=from && ages[i]<to)? true:false);
    	Plotly.restyle(gd, 'visible', vv);