Как изменить высоту изображения с помощью переменной?

Мне пришлось создать подсчет частоты каждой буквы, которая встречается в предложении. Эта частота затем помещена в диаграмму. Мы берем этот gif 1px на 1px и растягиваем его, чтобы достичь нормализованного значения (максимум 100px) текущей частоты букв. Например, если бы у меня была фраза «Cwm fjord bank glyphs vext quiz», каждая буква имела бы 100 пикселей, поскольку она использует каждую букву только один раз.

Поэтому я создал массив, чтобы отсортировать время появления каждого слова. Затем выяснить, какое слово встречается чаще всего, чтобы я знал, на что мне придется разделить каждое слово. Значение будет высотой изображения, когда я его сделаю.

function htmlChart() {
    var table = document.getElementById("table");
    input = document.getElementById("userInput").value;
    table.innerHTML = generateTable(input);
}

function generateTable(input) {
    var frequency = new Array(26);
    var letters = new Array(26);
    var freqPos = 0;
    var newInput = input.toUpperCase();
    var max = 0;
    var myHeight = 0;
    var test = 9000;
    var image = new Image();
    image.src = "orange.gif";
    for (i = 65; i < 91; i++) {
        //looks at how many times each character occurs and stores its value
        frequency[freqPos] = newInput.split(String.fromCharCode(i)).length -
            1;
        freqPos++;
    }
    //checks which letter occured the most
    for (i = 0; i < frequency.length - 1; i++) {
        if (frequency[i] > max) {
            max = frequency[i];
        }
    }

    table = input + "<table>";
    //first row 
    table += "<tr>";
    table += "<td>Letter Frequency 100px</td>";
    for (i = 0; i < frequency.length - 1; i++) {
        //somehow have to use myHeight to change the height of the image that I make here. 
        myHeight = (frequency[i] / max) * 100;
        table +=
            '<td><img src = "orange.gif" id = "orange" alt = "25" height = myHeight + "px" width = "5"></td>';
    }
    table += "</tr>";
    //second row
    table += "<tr>";
    table += "<td></td>";
    for (i = 65; i < 91; i++) {
        table += "<td>" + String.fromCharCode(i) + "</td>";
    }
    table += "</tr>";
    table += "</table>";
    return table;
}

Итак, как видите, я уже сделал частотную диаграмму, но я просто не знаю, как изменить высоту на значение myHeight. Может ли кто-нибудь объяснить, как мне это сделать?


person Manny Sran    schedule 17.11.2015    source источник


Ответы (1)


Похоже, конкатенация отключена. Изменить это

'<td><img src = "orange.gif" id = "orange" alt = "25" height = myHeight + "px" width = "5"></td>';

to

'<td><img src = "orange.gif" id = "orange" alt = "25" height="' + myHeight + 'px" width = "5"></td>';

Обратите внимание, что каждая объединяемая строка заключена в одинарную кавычку '.

person FuzzyTree    schedule 17.11.2015