我正在尝试做一些基于句子中字符数量的动态规划。英语字母表中哪个字母在屏幕上占像素最多?
当前回答
那么程序化的解决方案呢?
var capsIndex = 65; var smallIndex = 97 var div = document.createElement('div'); div.style.float = 'left'; document.body.appendChild(div); var highestWidth = 0; var elem; for(var i = capsIndex; i < capsIndex + 26; i++) { div.innerText = String.fromCharCode(i); var computedWidth = window.getComputedStyle(div, null).getPropertyValue("width"); if(highestWidth < parseFloat(computedWidth)) { highestWidth = parseFloat(computedWidth); elem = String.fromCharCode(i); } } for(var i = smallIndex; i < smallIndex + 26; i++) { div.innerText = String.fromCharCode(i); var computedWidth = window.getComputedStyle(div, null).getPropertyValue("width"); if(highestWidth < parseFloat(computedWidth)) { highestWidth = parseFloat(computedWidth); elem = String.fromCharCode(i); } } div.innerHTML = '<b>' + elem + '</b>' + ' won';
其他回答
那么程序化的解决方案呢?
var capsIndex = 65; var smallIndex = 97 var div = document.createElement('div'); div.style.float = 'left'; document.body.appendChild(div); var highestWidth = 0; var elem; for(var i = capsIndex; i < capsIndex + 26; i++) { div.innerText = String.fromCharCode(i); var computedWidth = window.getComputedStyle(div, null).getPropertyValue("width"); if(highestWidth < parseFloat(computedWidth)) { highestWidth = parseFloat(computedWidth); elem = String.fromCharCode(i); } } for(var i = smallIndex; i < smallIndex + 26; i++) { div.innerText = String.fromCharCode(i); var computedWidth = window.getComputedStyle(div, null).getPropertyValue("width"); if(highestWidth < parseFloat(computedWidth)) { highestWidth = parseFloat(computedWidth); elem = String.fromCharCode(i); } } div.innerHTML = '<b>' + elem + '</b>' + ' won';
大写的“M”通常是最宽的。
我认为字母W是最宽的。
我知道公认的答案是W, W代表胜利。
但是,在本例中,W也表示宽度。案例研究使用了一个简单的宽度测试来检查像素,但它只是宽度,而不是总像素数。作为一个简单的反例,公认的答案假设O和Q占用相同数量的像素,但它们只占用相同数量的空间。
因此,W占的空间最大。但是,这是所有的像素,它被吹捧吗?
让我们来看看一些经验数据。我从下面的B, M和w中创建了imgur图像,然后分析了它们的像素数(见下文),结果如下:
B: 114像素
M: 150像素
女:157像素
以下是我如何将它们放入画布并分析图像中的原始像素数据。
var imgs = { B : "//i.imgur.com/YOuEPOn.png", M : "//i.imgur.com/Aev3ZKQ.png", W : "//i.imgur.com/xSUwE7w.png" }; window.onload = function(){ for(var key in imgs){(function(img,key){ var Out = document.querySelector("#"+key+"Out"); img.crossOrigin = "Anonymous"; img.src=imgs[key]; img.onload = function() { var canvas = document.querySelector('#'+key); (canvas.width = img.width,canvas.height = img.height); var context = canvas.getContext('2d'); context.drawImage(img, 0, 0); var data = context.getImageData(0, 0, img.width, img.height).data; Out.innerHTML = "Total Pixels: " + data.length/4 + "<br>"; var pixelObject = {}; for(var i = 0; i < data.length; i += 4){ var rgba = "rgba("+data[i]+","+data[i+1]+","+data[i+2]+","+data[i+3]+")"; pixelObject[rgba] = pixelObject[rgba] ? pixelObject[rgba]+1 : 1; } Out.innerHTML += "Total Whitespace: " + pixelObject["rgba(255,255,255,255)"] + "<br>"; Out.innerHTML += "Total Pixels In "+ key +": " + ((data.length/4)-pixelObject["rgba(255,255,255,255)"]) + "<br>"; }; })(new Image(),key)} }; <table> <tr> <td> <canvas id="B" width="100%" height="100%"></canvas> </td> <td id="BOut"> </td> </tr> <tr> <td> <canvas id="M" width="100%" height="100%"></canvas> </td> <td id="MOut"> </td> </tr> <tr> <td> <canvas id="W" width="100%" height="100%"></canvas> </td> <td id="WOut"> </td> </tr> </table>
这取决于字体。我会用你最熟悉的编程语言创建一个小程序,把字母表中的每个字母画成n乘以m的位图。用白色初始化每个像素。然后,在你画完每个字母后,数一数白色像素的数量,并保存这个数字。你找到的最大的数字就是你要找的数字。
编辑:如果你实际上只是对哪个占据了最大的矩形感兴趣(但看起来你真的是在追求它,而不是像素),你可以使用各种API调用来找到大小,但这取决于你的编程语言。例如,在Java中,您将使用FontMetrics类。