Изображение для преобразования в ASCII

Пролог

Этот вопрос появляется здесь на SO время от времени, но обычно удаляется из-за плохо написанного вопроса. Я видел много таких вопросов, а затем молчал от OP (обычный низкий уровень), когда запрашивается дополнительная информация. Время от времени, если вход для меня достаточно хорош, я решаю ответить с ответом, и он обычно получает несколько голосов в день в активном состоянии, но затем через несколько недель вопрос удаляется/удаляется, и все начинается с самого начала, Поэтому я решил написать этот Q & A, чтобы я мог напрямую ссылаться на такие вопросы, не переписывая ответ снова и снова...

Еще одна причина - это поток META, нацеленный на меня, поэтому, если вы получили дополнительный вход, не стесняйтесь комментировать.

Вопрос

Как преобразовать растровое изображение в ASCII art с помощью С++?

Некоторые ограничения:

  • изображения с серой шкалой
  • с использованием шрифтов с одним интервалом
  • сохраняя его просто (не используя слишком продвинутый материал для начинающих программистов)

Вот связанная страница Wiki ASCII art (благодаря @RogerRowland)

Ответ 1

Существует больше подходов к преобразованию изображений в ASCII, которые в основном основаны на использовании шрифтов с одним интервалом для простоты. Я придерживаюсь только основ:

основанная на пикселях/области (затенение)

Этот подход обрабатывает каждый пиксель области пикселей как единую точку. Идея состоит в том, чтобы вычислить среднюю интенсивность серой шкалы этой точки, а затем заменить ее символом с достаточно высокой интенсивностью на вычисленную. Для этого нам нужен некоторый список пригодных для использования символов, каждый из которых с заранее вычисленной интенсивностью позволяет назвать его символьной map. Чтобы быстрее выбрать, какой символ является лучшим, для которого интенсивность существует двумя способами:

  1. линейно распределенная карта характера интенсивности

    Поэтому мы используем только те символы, которые имеют разность интенсивностей с тем же шагом. Другими словами, когда отсортировано по возрастанию, тогда:

    intensity_of(map[i])=intensity_of(map[i-1])+constant;
    

    Также, когда наша map символов сортируется, мы можем вычислить характер непосредственно из интенсивности (поиск не требуется)

    character=map[intensity_of(dot)/constant];
    
  2. произвольная распределенная карта характера интенсивности

    Таким образом, у нас есть множество полезных символов и их интенсивность. Нам нужно найти интенсивность, ближайшую к intensity_of(dot) Итак, если мы отсортировали map[] мы можем использовать бинарный поиск, иначе нам нужен O(n) поиск минимальной дистанционной циклы или O(1) словаря. Иногда для простоты map[] символов map[] может обрабатываться как линейно распределенная, что приводит к небольшим искажениям гамма-искажений, обычно невидимым в результате, если вы не знаете, что искать.

Интенсивное преобразование отлично подходит и для серо-масштабных изображений (а не только для черно-белых). Если вы выбираете точку в виде одного пикселя, результат становится большим (1 пиксель → один символ), поэтому для больших изображений выбирается область (умноженная на размер шрифта), чтобы сохранить соотношение сторон и не увеличиваться слишком сильно.

Как это сделать:

  1. поэтому равномерно делить изображения на (серые) пиксели или (прямоугольные) области dot 's
  2. вычислить интенсивность каждого пикселя/области
  3. замените его символом из карты символов с максимальной интенсивностью

В качестве map символов вы можете использовать любые символы, но результат становится лучше, если символ имеет пиксели, распределенные равномерно вдоль области символов. Для начала вы можете использовать:

  • char map[10]=".,:;ox%#@";

сортируются по убыванию и притворяются линейно распределенными.

Поэтому, если интенсивность пикселя/области равна i = <0-255> тогда символ замены будет

  • map[(255-i)*10/256];

если i==0 тогда пиксель/область будет черным, если i==127 тогда пиксель/область будет серым, а если i==255 то пиксель/область будет белым. Вы можете экспериментировать с разными символами внутри map[]...

Здесь древний пример моего в C++ и VCL:

AnsiString m=" .,:;ox%#@";
Graphics::TBitmap *bmp=new Graphics::TBitmap;
bmp->LoadFromFile("pic.bmp");
bmp->HandleType=bmDIB;
bmp->PixelFormat=pf24bit;

int x,y,i,c,l;
BYTE *p;
AnsiString s,endl;
endl=char(13); endl+=char(10);
l=m.Length();
s="";
for (y=0;y<bmp->Height;y++)
    {
    p=(BYTE*)bmp->ScanLine[y];
    for (x=0;x<bmp->Width;x++)
        {
        i =p[x+x+x+0];
        i+=p[x+x+x+1];
        i+=p[x+x+x+2];
        i=(i*l)/768;
        s+=m[l-i];
        }
    s+=endl;
    }
mm_log->Lines->Text=s;
mm_log->Lines->SaveToFile("pic.txt");
delete bmp;

вам нужно заменить/игнорировать материал VCL, если вы не используете среду Borland/Embarcadero

  • mm_log - это memo, где выводится текст
  • bmp - это битовая карта ввода
  • AnsiString - это строка типа VCL, индексированная форма 1, не из 0 в качестве char* !!!

это результат: Пример изображения интенсивности NSFW

Слева находится выход ASCII art (размер шрифта 5px), а на правом изображении - несколько раз. Как вы видите, на выходе больше пикселя → символ. если вы используете более крупные области вместо пикселей, то масштаб меньше, но, конечно, выход менее визуально приятен. Этот подход очень прост и быстрый для кодирования/обработки.

Когда вы добавляете более продвинутые вещи, такие как:

  • автоматизированные вычисления карт
  • автоматический выбор размера пикселя/области
  • корректировка соотношения сторон

Затем вы можете обрабатывать более сложные изображения с лучшими результатами:

здесь результат в соотношении 1:1 (увеличение для просмотра персонажей):

intensity advanced example

Разумеется, для выборочной выборки вы теряете мелкие детали. Это изображение того же размера, что и первый пример, выбранный с областями:

Немного расширенный пример интенсивности интенсивности NSFW

Как вы можете видеть, это больше подходит для больших изображений

Подбор символов (гибрид между затенением и сплошным искусством ASCII)

Этот подход пытается заменить область (не более одиночных пиксельных точек) с характером с одинаковой интенсивностью и формой. Это приводит к лучшим результатам даже при использовании больших шрифтов по сравнению с предыдущим подходом, с другой стороны, этот подход, конечно, немного медленнее. Есть больше способов сделать это, но основная идея - вычислить разницу (расстояние) между областью изображения (dot) и визуализированным символом. Вы можете начать с наивной суммы абс-разницы между пикселями, но это приведет к не очень хорошим результатам, потому что даже сдвиг в 1 пиксель сделает расстояние большим, вместо этого вы можете использовать корреляцию или разные показатели. Общий алгоритм почти такой же, как и предыдущий подход:

  1. поэтому равномерно делить изображение на (серого) прямоугольные области dot 's
    • в идеале с тем же соотношением сторон, что и отображаемые символы шрифта (он сохранит пропорции, не забывайте, что символы обычно перекрывают бит по оси x)
  2. вычислить интенсивность каждой области (dot)
  3. замените его символом из символьной map с ближайшей интенсивностью/формой

Как вычислить расстояние между символом и точкой? Это самая сложная часть этого подхода. Экспериментируя, я развиваю этот компромисс между скоростью, качеством и простотой:

  1. Разделить область символов на зоны

    zones

    • вычислить отдельную интенсивность для левой, правой, верхней, нижней и центральной зон каждого символа из вашего алфавита преобразования (map)
    • нормализуют все интенсивности, поэтому они независимы от размера области i=(i*256)/(xs*ys)
  2. изображение источника процесса в областях прямоугольника

    • (с тем же соотношением сторон, что и целевой шрифт)
    • для каждой области вычислить интенсивность таким же образом, как в пуле 1
    • найти самое близкое соответствие от интенсивностей в алфавите преобразования
    • выходной символ

Это результат для размера шрифта = 7px

char fitting example

Как вы можете видеть, результат визуально приятен даже при использовании большего размера шрифта (пример предыдущего подхода был с размером шрифта 5 пикселей). Выходной сигнал примерно того же размера, что и входное изображение (без увеличения). Лучшие результаты достигаются, потому что персонажи ближе к оригинальному изображению не только по интенсивности, но и по общей форме, поэтому вы можете использовать более крупные шрифты и все еще сохранять детали (вплоть до грубой).

Здесь полный код для конверсионного приложения на основе VCL:

//---------------------------------------------------------------------------
#include <vcl.h>
#pragma hdrstop

#include "win_main.h"
//---------------------------------------------------------------------------
#pragma package(smart_init)
#pragma resource "*.dfm"
TForm1 *Form1;
Graphics::TBitmap *bmp=new Graphics::TBitmap;
//---------------------------------------------------------------------------
class intensity
    {
public:
    char c;                 // character
    int il,ir,iu,id,ic;     // intensity of part: left,right,up,down,center
    intensity() { c=0; reset(); }
    void reset() { il=0; ir=0; iu=0; id=0; ic=0; }
    void compute(DWORD **p,int xs,int ys,int xx,int yy) // p source image, (xs,ys) area size, (xx,yy) area position
        {
        int x0=xs>>2,y0=ys>>2;
        int x1=xs-x0,y1=ys-y0;
        int x,y,i;
        reset();
        for (y=0;y<ys;y++)
         for (x=0;x<xs;x++)
            {
            i=(p[yy+y][xx+x]&255);
            if (x<=x0) il+=i;
            if (x>=x1) ir+=i;
            if (y<=x0) iu+=i;
            if (y>=x1) id+=i;
            if ((x>=x0)&&(x<=x1)
              &&(y>=y0)&&(y<=y1)) ic+=i;
            }
        // normalize
        i=xs*ys;
        il=(il<<8)/i;
        ir=(ir<<8)/i;
        iu=(iu<<8)/i;
        id=(id<<8)/i;
        ic=(ic<<8)/i;
        }
    };
//---------------------------------------------------------------------------
AnsiString bmp2txt_big(Graphics::TBitmap *bmp,TFont *font) // charcter sized areas
    {
    int i,i0,d,d0;
    int xs,ys,xf,yf,x,xx,y,yy;
    DWORD **p=NULL,**q=NULL;    // bitmap direct pixel access
    Graphics::TBitmap *tmp;     // temp bitmap for single character
    AnsiString txt="";          // output ASCII art text
    AnsiString eol="\r\n";      // end of line sequence
    intensity map[97];          // character map
    intensity gfx;

    // input image size
    xs=bmp->Width;
    ys=bmp->Height;
    // output font size
    xf=font->Size;   if (xf<0) xf=-xf;
    yf=font->Height; if (yf<0) yf=-yf;
    for (;;) // loop to simplify the dynamic allocation error handling
        {
        // allocate and init buffers
        tmp=new Graphics::TBitmap; if (tmp==NULL) break;
            // allow 32bit pixel access as DWORD/int pointer
            tmp->HandleType=bmDIB;    bmp->HandleType=bmDIB;
            tmp->PixelFormat=pf32bit; bmp->PixelFormat=pf32bit;
            // copy target font properties to tmp
            tmp->Canvas->Font->Assign(font);
            tmp->SetSize(xf,yf);
            tmp->Canvas->Font ->Color=clBlack;
            tmp->Canvas->Pen  ->Color=clWhite;
            tmp->Canvas->Brush->Color=clWhite;
            xf=tmp->Width;
            yf=tmp->Height;
        // direct pixel access to bitmaps
        p  =new DWORD*[ys];        if (p  ==NULL) break; for (y=0;y<ys;y++) p[y]=(DWORD*)bmp->ScanLine[y];
        q  =new DWORD*[yf];        if (q  ==NULL) break; for (y=0;y<yf;y++) q[y]=(DWORD*)tmp->ScanLine[y];
        // create character map
        for (x=0,d=32;d<128;d++,x++)
            {
            map[x].c=char(DWORD(d));
            // clear tmp
            tmp->Canvas->FillRect(TRect(0,0,xf,yf));
            // render tested character to tmp
            tmp->Canvas->TextOutA(0,0,map[x].c);
            // compute intensity
            map[x].compute(q,xf,yf,0,0);
            } map[x].c=0;
        // loop through image by zoomed character size step
        xf-=xf/3; // characters are usually overlaping by 1/3
        xs-=xs%xf;
        ys-=ys%yf;
        for (y=0;y<ys;y+=yf,txt+=eol)
         for (x=0;x<xs;x+=xf)
            {
            // compute intensity
            gfx.compute(p,xf,yf,x,y);
            // find closest match in map[]
            i0=0; d0=-1;
            for (i=0;map[i].c;i++)
                {
                d=abs(map[i].il-gfx.il)
                 +abs(map[i].ir-gfx.ir)
                 +abs(map[i].iu-gfx.iu)
                 +abs(map[i].id-gfx.id)
                 +abs(map[i].ic-gfx.ic);
                if ((d0<0)||(d0>d)) { d0=d; i0=i; }
                }
            // add fitted character to output
            txt+=map[i0].c;
            }
        break;
        }
    // free buffers
    if (tmp) delete tmp;
    if (p  ) delete[] p;
    return txt;
    }
//---------------------------------------------------------------------------
AnsiString bmp2txt_small(Graphics::TBitmap *bmp)    // pixel sized areas
    {
    AnsiString m=" ''.,:;i+o*%&$#@"; // constant character map
    int x,y,i,c,l;
    BYTE *p;
    AnsiString txt="",eol="\r\n";
    l=m.Length();
    bmp->HandleType=bmDIB;
    bmp->PixelFormat=pf32bit;
    for (y=0;y<bmp->Height;y++)
        {
        p=(BYTE*)bmp->ScanLine[y];
        for (x=0;x<bmp->Width;x++)
            {
            i =p[(x<<2)+0];
            i+=p[(x<<2)+1];
            i+=p[(x<<2)+2];
            i=(i*l)/768;
            txt+=m[l-i];
            }
        txt+=eol;
        }
    return txt;
    }
//---------------------------------------------------------------------------
void update()
    {
    int x0,x1,y0,y1,i,l;
    x0=bmp->Width;
    y0=bmp->Height;
    if ((x0<64)||(y0<64)) Form1->mm_txt->Text=bmp2txt_small(bmp);
     else                 Form1->mm_txt->Text=bmp2txt_big  (bmp,Form1->mm_txt->Font);
    Form1->mm_txt->Lines->SaveToFile("pic.txt");
    for (x1=0,i=1,l=Form1->mm_txt->Text.Length();i<=l;i++) if (Form1->mm_txt->Text[i]==13) { x1=i-1; break; }
    for (y1=0,i=1,l=Form1->mm_txt->Text.Length();i<=l;i++) if (Form1->mm_txt->Text[i]==13) y1++;
    x1*=abs(Form1->mm_txt->Font->Size);
    y1*=abs(Form1->mm_txt->Font->Height);
    if (y0<y1) y0=y1; x0+=x1+48;
    Form1->ClientWidth=x0;
    Form1->ClientHeight=y0;
    Form1->Caption=AnsiString().sprintf("Picture -> Text ( Font %ix%i )",abs(Form1->mm_txt->Font->Size),abs(Form1->mm_txt->Font->Height));
    }
//---------------------------------------------------------------------------
void draw()
    {
    Form1->ptb_gfx->Canvas->Draw(0,0,bmp);
    }
//---------------------------------------------------------------------------
void load(AnsiString name)
    {
    bmp->LoadFromFile(name);
    bmp->HandleType=bmDIB;
    bmp->PixelFormat=pf32bit;
    Form1->ptb_gfx->Width=bmp->Width;
    Form1->ClientHeight=bmp->Height;
    Form1->ClientWidth=(bmp->Width<<1)+32;
    }
//---------------------------------------------------------------------------
__fastcall TForm1::TForm1(TComponent* Owner):TForm(Owner)
    {
    load("pic.bmp");
    update();
    }
//---------------------------------------------------------------------------
void __fastcall TForm1::FormDestroy(TObject *Sender)
    {
    delete bmp;
    }
//---------------------------------------------------------------------------
void __fastcall TForm1::FormPaint(TObject *Sender)
    {
    draw();
    }
//---------------------------------------------------------------------------
void __fastcall TForm1::FormMouseWheel(TObject *Sender, TShiftState Shift,int WheelDelta, TPoint &MousePos, bool &Handled)
    {
    int s=abs(mm_txt->Font->Size);
    if (WheelDelta<0) s--;
    if (WheelDelta>0) s++;
    mm_txt->Font->Size=s;
    update();
    }
//---------------------------------------------------------------------------

Это простая форма приложения (Form1) с одним TMemo mm_txt в нем. Он загружает изображение "pic.bmp", затем согласно разрешению выбирает, какой подход использовать для преобразования в текст, который сохраняется в "pic.txt" и отправляется в памятку для визуализации. Для тех, у кого нет VCL, игнорировать материал VCL и заменить AnsiString любым строковым типом, который у вас есть, а также Graphics::TBitmap с любым растровым или образным классом, которым вы располагаете, с возможностью доступа к пикселям.

Очень важно отметить, что это использует настройки mm_txt->Font поэтому убедитесь, что вы установили:

  • Font->Pitch=fpFixed
  • Font->Charset=OEM_CHARSET
  • Font->Name="System"

чтобы сделать эту работу должным образом, шрифт не будет обрабатываться как однострочный. Колесо мыши просто изменяет размер шрифта вверх/вниз, чтобы увидеть результаты по разным размерам шрифта

[Заметки]

  • см. визуализацию портфолио Word
  • использовать язык с возможностью растрового/файлового доступа и вывода текста
  • настоятельно рекомендую начать с первого подхода, так как очень легко проложить вперед и просто, и только затем переходить ко второму (что может быть сделано как модификация первого, так что большая часть кода остается такой же, как и в любом случае)
  • Это хорошая идея для вычисления с инвертированной интенсивностью (черные пиксели являются максимальным значением), поскольку стандартный предварительный просмотр текста на белом фоне, что приводит к гораздо лучшим результатам.
  • вы можете поэкспериментировать с размером, подсчетом и расположением зон подраздела или использовать вместо этого некоторую сетку, например 3x3.

Сравнение [Edit1]

Наконец, это сравнение между двумя подходами на одном и том же входе:

comparison

Зеленые точки с изображениями помечены с подходом № 2, а красные - с номером 1, размером 6 пикселей. Как вы можете видеть на изображении лампочки, чувствительный к форме подход намного лучше (даже если # 1 выполняется на 2x увеличенном исходном изображении).

[Edit2] классное приложение

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

ОК приложение состоит из всего 2 окон. Первое главное окно - это, в основном, мое старое окно конвертера без выбора и предварительного просмотра изображения (все это в нем). Он имеет только настройки предварительного просмотра и преобразования ASCII. Второе окно - это пустая форма с прозрачной внутри для выбора области захвата (без каких-либо функций).

Теперь по таймеру я просто захватил выбранную область по форме выбора, передал ее конверсии и просмотрел ASCIIart.

Таким образом, вы заключите область, которую хотите преобразовать в окне выбора, и просмотрите результат в главном окне. Это может быть игра, зритель,... Это выглядит так:

ASCIIart grabber example

Так что теперь я могу смотреть даже видео в ASCIIart для удовольствия. Некоторые из них действительно приятные :).

hands

[Edit3]

Если вы хотите попытаться реализовать это в GLSL, посмотрите на это: