Estoy tratando de establecer este valor de mapa en función de los valores i y j. Pensé que si los pasaba usarían los valores locales, pero obtengo 0 e indefinido para i y j cuando hago clic en cualquiera de ellos. Pero los Id son los valores correctos. Las matrices están pobladas.
let j = 1 for (const string of yStart) { let i = 0; for (let fret of fretPositionsArray) { d3.select("#fretboard") .append('rect') .on("click", function (i,j) { let strfrt = { str: j, frt: i} music.set(Math.random(), strfrt); for (let k of music.keys()) { // console.log(k) } for (let v of music.values()) { console.log(v) } localStorage.setItem("testMusic", JSON.stringify(Array.from(music.entries()))); }) .on("mouseover", function () { d3.select(this).attr('fill', 'green') }) .on('mouseout', function () { d3.select(this).attr('fill', 'orange') }) .attr("id", "S" + j + "F" + (i + 1)) .attr('x', fret) .attr('y', string) .attr('width', fretWidthArray[i]) .attr('height', 30) //.attr('stroke', 'green') .attr('stroke-linecap', 'butt') .attr('stroke-width', '1') .attr('fill', '#FFFAEF') .attr('fill-opacity', .1) i++ } j++ }D3 dicta los parámetros de su devolución de llamada de "clic". Elimínelos completamente de su función anónima:
.on("click", function () { De los documentos en d3.selection.on
Cuando se envía un evento específico en un elemento seleccionado, el oyente especificado se evaluará para el elemento, pasando el evento actual (evento) y el dato actual (d), con este como el elemento DOM actual (evento.objetivo actual).
Entonces, en el alcance de su devolución de llamada, ahora j i ahora el dato