我想创建一个函数来通过层/行和列 id 获取分形子对象的绝对 id。在分形对象中存在重复的子对象，您可以将它们拆分为图层。任何具有标识符“W”的对象都包含 7x G，由 G 标识的每个对象又包含 7x N，等等。
if layer is ...
...3 (rowId=2) then only strings with "N"...
...2 (rowId=1) then only strings with "G"...
...
are counted.
原始代码：
const rawData = [["W1","W2","W3","W4","W5","W6","W7"],
["G1","G2","G3","G4","G5","G6","G7"],
["N1","N2","N3","N4","N5","N6","N7"],
["T1","T2","T3","T4","T5","T6","T7"]]
const selIds=[0,1,2,4] // selected indices of W1 G2 N3 T5 (range per array element: [0-6])
// to calculate absolute fractal "cell" counter; following input is given by click on subobject
rowId=1 // layer index - 1 (0-6)
colId=2 // element index - 1 (0-6)
我想结果可以这样计算吗？
result=((7^1*selIds[0])+selIds[1]*7^0)*7^(rowId+1)+3=(0+1)*49+3=52
单击
selIdsrowIdcolIdsselIds=[0,2,2,4]rawData到目前为止我的职能：
const getCurrentIndex = function(elementIndex, layerIndex) {
let currentIndex = 0
if(layerIndex > 0) {
for(let j = 0; j < layerIndex; j++) {
currentIndex += (selIds[j]) * Math.pow(7, layerIndex-j)
}
}
currentIndex += elementIndex
currentIndex += 1
return currentIndex
}
示例（图层/行和元素/列 = 绝对 id）：
W1:G1:N1:T1 = 1
W1:G1:N1 = 1
W4:G5:N6 = 3*7*7 + 4*7 + 6 = 181
W2:G2:N3 = 1*7*7 + 1*7 + 3 = 59
W3:G4:N3 = 2*7*7 + 3*7 + 3 = 122
W4:G4:N4 = 3*7*7 + 3*7 + 4 = 172
W2:G2:N3:T4 = 1*7*7*7 + 1*7*7 + 2*7 + 4 = 410
Column id 是被
:只是为了完整性 - HTML 代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<h1 id="header"></h1>
<div id="main"></div>
<script src="src/script.js"></script>
</body>
</html>
script.js - 在单击时创建元素和事件侦听器：
const spanHeads = ['Row0','Row1','Row2','Row3','Row4']
const dataMap = [...] // rawData
const separator = '-'
const currentIndices = [0, 0, 0, 0, 0] // selIds (default: 0)
const layerListeners = [];
const updateSpanText = function(layerIndex, elementIndex, subLayerIndex) {
document.querySelector('#span'+subLayerIndex+separator+elementIndex).innerText = getCurrentIndex(layerIndex, elementIndex, subLayerIndex)+'. '+dataMap[subLayerIndex][elementIndex]
}
for(let i = 0; i < dataMap.length; i++) { // each layer
const tempDiv = document.createElement('div');
tempDiv.id = 'div'+i
tempDiv.className='row'
layerListeners[i] = [];
const headSpan = document.createElement('span');
headSpan.className="cell row head"
headSpan.innerText = spanHeads[i]
tempDiv.appendChild(headSpan);
for(let j = 0; j < dataMap[i].length; j++) { // each layer element
const tempSpan = document.createElement('span');
tempSpan.id = 'span'+i+separator+j
if(j == currentIndices[i] && i < dataMap.length-1) tempSpan.className="cell dynamic selected"
else tempSpan.className="cell dynamic unselected"
tempDiv.appendChild(tempSpan);
if(i < dataMap.length-1) { // not last layer
layerListeners[i][j] = function() {
currentIndices[i] = j // update layer index
console.log(currentIndices);
const subLayerIndex = i+1
for(let l = 0; l < dataMap[subLayerIndex].length; l++) { // each layer element
// style selected cell
if(currentIndices[i] == l) {
document.querySelector('#span'+i+separator+l).className = "cell dynamic selected"
}
else {
document.querySelector('#span'+i+separator+l).className = "cell dynamic unselected"
}
updateSpanText(i, l, subLayerIndex)
}
}
tempSpan.addEventListener('click', layerListeners[i][j], false);
}
}
document.querySelector('#main').appendChild(tempDiv);
}
for(let i = 0; i < dataMap.length; i++) { // fill default content
for(let l = 0; l < dataMap[i].length; l++) {
updateSpanText(i, l, i)
}
}
解决办法是：
const getCurrentIndex = function(elementIndex, layerIndex) {
let currentIndex = 0
for(let j = 0; j < layerIndex; j++) {
currentIndex += (currentIndices[j]) * Math.pow(dataMap[j].length, layerIndex-j)
}
currentIndex += elementIndex
currentIndex += 1
return currentIndex
}