Установка начальной непрозрачности по умолчанию для точек на карте d3 - PullRequest
Новая
       4

Установка начальной непрозрачности по умолчанию для точек на карте d3

0 голосов
/ 23 января 2019

У меня есть карта d3.js, которая обновит непрозрачность точек на основе ползунка временного диапазона. Проблема в том, что если я установлю начальную непрозрачность точек на определенное значение, то это станет глобальным, и функция обновления, которая обновляет непрозрачность, не будет работать. Код ниже: 

 //Build time-slider in HTML

 <input id="timeslide" type="range" class="slider" min="0" max="25" value="0" step="1"   /><br>

 //Set values for time range slider
var inputValue = null;
var years = ["1993","1994","1995","1996","1997","1998","1999","2000","2001","2002","2003","2004","2005","2006","2007","2008","2009", "2010","2011","2012","2013","2014","2015","2016","2017","2018","2019"];

//load in the points and style
var feature = mapG.selectAll("circle")
        .data(SFData)
        .enter().append("circle")   
        .style("opacity", initialDateMatch) //How should I write this function?

    // when time slider input, call 'update' function
    d3.select("#timeslide-leaflet").on("input", function() {        
        update(+this.value, currentValue);   
    });

 //'update' function to update points' opacity
function update(value, currentValue) {

        //do some things to check current value of time slider to determine opacity
        document.getElementById("range-leaflet").innerHTML=years[value]
        inputValue = years[value];
        d3.selectAll(".features")
            .attr("opacity", dateMatch)

}

// 'Function to match time slider value to data properties value, to determine opacity
function dateMatch(data, value) {
    var date = (data.properties.Sign_Date);
    var year = date.substring(0, 4);
    var inputValueInt = parseInt(inputValue, 10);
    var yearInt = parseInt(year, 10);

    if (yearInt <= inputValueInt) {
        //console.log('match!'+ year)

     return ".7";
    } else {
        return "0";
    };
}

Я бы хотел, чтобы все точки, которые отображаются на карте, имели непрозрачность «по умолчанию», равную «0,7». Вместо этого, как и сейчас, поскольку изначально у меня нет непрозрачности, все они на 100% непрозрачны. Все остальное работает отлично, как бы мне просто получить все точки для стилизации до того, как будет создан экземпляр ползунка и вызвана функция обновления? Заранее спасибо!

...