代码之家 › 专栏 › 技术社区 › Mathias Schnell

尝试优化像素读取和输出函数

pixel html css php

3

Mathias Schnell · 技术社区 · 15 年前

$img = imagecreatefrompng("img/".$image); 
    $w = imagesx($img); 
    $h = imagesy($img); 
    $pixelcount = 0;

    echo "<div id='container' style='width: {$w}px; height: {$h}px;'>\r\n";
    for($y=0;$y<$h;$y++)    { 
        for($x=0;$x<$w;$x++)    { 
            $rgb = imagecolorat($img, $x, $y); 
            $r = ($rgb >> 16) & 0xFF; 
            $g = ($rgb >> 8) & 0xFF; 
            $b = $rgb & 0xFF;
            $alpha = (imagecolorat($img,$x,$y) & 0x7F000000) >> 24;
            if($alpha == 127)
                $newcolor = "transparent";
            else
                $newcolor = sprintf('#%02X%02X%02X', $r, $g, $b);
            if(isset($prevcolor) && strcmp($newcolor, $prevcolor) != 0)
            {
                echo "<div style='background: {$prevcolor}; height: 1px; width: {$pixelcount}px; float: left;'></div>\r\n";
                $pixelcount = 0;
            }
            $prevcolor = $newcolor;
            $pixelcount++;
        }
        echo "<div style='background: {$prevcolor}; height: 1px; width: {$pixelcount}px; float: left;'></div>\r\n";
        unset($prevcolor);
        $pixelcount = 0;
    } 
    echo "</div>\r\n";

http://schnell.dreamhosters.com/folio/pixelread.php?image=link.png

鼠标滚轮向上,I和+/=键放大。鼠标滚轮向下,O和-/\键缩小。无需关注任何特定元素,整个文档注册了一个击键/鼠标滚轮。

编辑-谢谢你们解决了这个问题,伙计们!不过现在有新的了。如果你使用这个工具并试图放大它,精灵就会崩溃。如果你不管它,什么也不做,它看起来很好。奇怪的是,你不能通过重置图片的大小来修复它,直到你刷新页面时它才会被弄乱。

function resize(width, height)
    {
        $('div#container').css('height', factor * height);
        $('div#container').css('width', factor * width);
        $('div#container > div').css('height', factor).css('width', function(i, val) { return parseInt(val * factor) + 'px'; });
        $('div#container').css('margin-top', ($(window).height() - $('div#container').height())/2 + "px");
    }

因为某些原因,宽度不能乘以“因子”。我尝试这样做,jQuery对每个子div都这样做,将新的宽度建立在旧的基础上,而不必做一个巨大的for循环或任何事情,但是我想到的任何东西都不起作用。

Edit3-终于成功了!我只是将每个div的原始长度存储为每个div中的“id”属性,然后在需要调整所有内容时访问它。感谢每一个忍受这一切的人,并坚持让我坚持到底。我发誓调整尺寸比以前更顺利了!:D个

2 回复 | 直到 15 年前

1

2

Andrew Cooper 15 年前

    if(isset($prevcolor) && strcmp($hex, $prevcolor) != 0) {
        echo "<div style='background: {$prevcolor}; height: 1px; width: {$pixelcount}px; float: left;'></div>\r\n";
        $pixelcount = 0;
    }

2

Tim Stone 15 年前

我相信问题在于,在内部循环中,你永远不会重置 $pixelcount 在你使用它之后。因此,它只是行的总像素的累积,这意味着每次打印时,宽度都会逐渐变大。

根据您的描述,当您切换颜色时,您需要重置它:

if(isset($prevcolor) && strcmp($hex, $prevcolor) != 0) {
    echo "<div style='background: {$prevcolor}; height: 1px; width: {$pixelcount}px; float: left;'></div>\r\n";
    $pixelcount = 0; // Incremented back to 1 below
}

调整大小的问题来自resize函数,其中width现在设置不适当,因为每个块的基宽度不再是1:

var cssObj = {
    'width' : factor, // This factor needs to be multiplied by the original width
    'height' : factor
};
$('div#container > div').css(cssObj);

$('div#container').css('margin-top',
    ($(window).height() - $('div#container').height())/2 + "px");
$('div#container > div').each(function() {
    $(this).data('originalWidth', $(this).width());
});

…然后在resize函数中:

$('div#container > div')
     .css('height', factor)
     .css('width', function() {
         return $(this).data('originalWidth') * factor;
     });