Sementara mencoret-coret kertas berbentuk bujur sangkar beberapa hari yang lalu, saya menemukan font spasi negatif untuk digit. Jika Anda belum melihatnya, ruang antara bentuk di atas menghasilkan rasio emas 1,618033988749 . Dalam tantangan ini, tugas Anda adalah mengambil nomor sebagai masukan dan merendernya persis seperti contoh di atas.

Ini adalah bagaimana ini dibuat. Semua garis akan berada di kisi-kisi biasa, sehingga masing-masing digit terdiri dari sejumlah kecil sel kisi. Berikut adalah bentuk 10 digit (kami akan mengabaikan titik desimal untuk tantangan ini):

^{Ya, 7 berbeda dari contoh rasio emas di atas. Saya agak mengacaukannya. Kami akan pergi dengan yang ini.}

Perhatikan bahwa setiap digit tingginya lima sel, dan lebar tiga sel. Untuk membuat angka, Anda dapat membayangkan menempatkan semua digitnya di samping satu sama lain, sehingga ada satu kolom kosong di antara setiap pasangan digit. Misalnya, 319sebagai masukan, kami akan menulis:

Perhatikan bahwa kami menambahkan satu kolom kosong awal dan akhir. Sekarang kita membalikkan sel:

Output kemudian harus menjadi batas-batas poligon yang dihasilkan:

Tentu saja Anda dapat menghasilkan hasilnya dengan cara lain, selama output yang diberikan terlihat sama.

Memasukkan

• Anda dapat menulis program atau fungsi, mengambil input melalui STDIN (atau alternatif terdekat), argumen baris perintah atau argumen fungsi, sebagai string, atau daftar digit. (Anda tidak dapat mengambil nomor karena itu tidak akan memungkinkan Anda untuk mendukung angka nol di depan.)
• Anda dapat berasumsi bahwa tidak akan ada lagi 16 digit dalam input.

Keluaran

• Output dapat ditampilkan di layar atau ditulis ke file dalam format gambar yang umum.
• Anda dapat menggunakan grafik raster dan vektor.
• Dalam kedua kasus tersebut, rasio aspek sel-sel dari kisi yang mendasarinya harus 1 (yaitu, sel harus kuadrat).
• Dalam hal grafik raster, setiap sel harus mencakup setidaknya 20 kali 20 piksel.
• Garis tidak boleh lebih lebar dari 10% dari ukuran sel. Saya bersedia memberikan satu atau dua piksel kelonggaran karena aliasing di sini.
• Garis dan latar dapat berupa dua warna yang dapat dibedakan dengan jelas, tetapi bentuk yang dibuat oleh garis tidak harus diisi (yaitu bagian dalamnya harus merupakan warna latar belakang juga).
• Tidak boleh ada celah di dalam setiap loop tertutup.
• Tentu saja, seluruh hasil harus terlihat.

Uji Kasus

Berikut adalah 10 input, yang bersama-sama mencakup semua pasangan yang mungkin dari digit yang berdekatan, serta setiap digit depan dan belakang yang mungkin:

07299361548
19887620534
21456837709
39284106657
49085527316
59178604432
69471338025
79581224630
89674235011
97518264003

Dan inilah hasil yang diharapkan untuk itu:

Pastikan kode Anda juga berfungsi ketika diberi satu digit (saya tidak ingin menyertakan hasil yang diharapkan di sini, karena mereka harus jelas, dan bagian kasus uji cukup bengkak seperti itu).

BBC BASIC, 182 karakter ASCII (ukuran file toukuran 175 byte)

Unduh juru bahasa di http://www.bbcbasic.co.uk/bbcwin/bbcwin.html

I.n$
F.j=0TOLENn$*4p=ASCM."?@\@?[@_?DTP?TT@?pv@?PTD?@TD?||@?@T@?PT@",VALM.n$,j/4+1,1)*4+1+j MOD4)F.k=0TO4p*=2q=64A.p
V.537;q;0;2585;0;q;537;-q;0;2585;0;-q;25;0;64;
N.MOVEBY 64,-320N.

Penilaian: Ketika program di atas ditempelkan ke editor dan dijalankan, editor akan memperluas kata kunci yang disingkat menjadi kata kunci penuh pada layar, meskipun sebenarnya hanya 1 byte setelah tokenisasi. (Contoh I.= INPUTruang penyimpanan 1 byte.)

Penjelasan

Saya hanya akan menjelaskan apa yang dilakukan garis VDU: ia menggambar kotak dengan sedikit membalik warna piksel saat ini di layar. Ini berarti bahwa (dengan sedikit perhatian pada sudut-sudut) dimungkinkan untuk menggambar satu sel di samping satu sama lain, dan tepi intervensi akan membatalkan dan menghilang karena gambar ganda.

Pemeriksaan yang teliti akan mengungkapkan bahwa sudut kanan atas dan kiri bawah sel ditarik tetapi kiri atas dan kanan bawah tidak ada ("bulat") untuk membuat pekerjaan ini.

Setelah sel digambar, kursor grafik dipindahkan ke atas 32 piksel siap untuk sel berikutnya yang akan diambil.

Sisa dari program ini adalah dekompresi bitmap ASCII yang cukup mudah. Dimensi sel adalah 64x64 unit untuk bermain golf / kompatibel dengan cara bitmap didekompresi. qmengontrol ukuran sel yang diplot: 64x64 unit untuk sel yang ada, 0x0 untuk sel yang tidak ada.

Kode tidak dikunci

  m$="?@\@?[@_?DTP?TT@?pv@?PTD?@TD?||@?@T@?PT@" :REM bitmap for digits, including column of filled cells at left. BBC strings are 1-indexed
  INPUTn$                                       :REM user input
  FORj=0 TO LENn$*4                             :REM iterate 4 times per input digit, plus once more (plot column 0 of imaginary digit to finish)
    d=VAL MID$(n$,j/4+1,1)                      :REM extract digit from n$ (1-character string). VAL of empty string = 0, so 123->1,1,1,1,2,2,2,2,3,3,3,3,0
    p=ASC MID$(m$,d*4+1+j MOD4)                 :REM get column bitmap from m$ d*4 selects digit, j MOD4 selects correct column of digit, add 1 to convert to 1-index
    FORk=0TO4                                   :REM for each cell in the column
      p*=2                                      :REM bitshift p
      q=64ANDp                                  :REM find size of cell to draw. 64 for a filled cell, 0 for an absent cell.
      VDU537;q;0;                               :REM line q units right, inverting existing screen colour. Draw last pixel (will be inverted next line)
      VDU2585;0;q;                              :REM line q units up, inverting existing screen colour. Dont draw last pixel (will be filled in next line)
      VDU537;-q;0;                              :REM line q units left, inverting existing screen colour. Draw last pixel (will be inverted next line)
      VDU2585;0;-q;                             :REM line q units down, inverting existing screen colour. Dont draw last pixel (avoid inverting 1st pixel of 1st line)
      VDU25;0;64;                               :REM move up 64 units for cell above
    NEXT
    MOVEBY 64,-320                              :REM move right and down for next column.
  NEXT

Keluaran

The MOVEs hanya mendapatkan output untuk tepat ketinggian di layar. BBC basic menggunakan 2 unit = 1 piksel dalam mode ini, jadi sel-selnya sebenarnya 32x32 piksel.

Oktaf, 233 225 216 213 byte

o=@ones;l=z=o(5,1);for k=input('')-47;l=[l,reshape(dec2bin([448,22558,8514,10560,3936,2376,328,15840,320,2368](k),15),5,[])-48,z];end;L=~o(size(l)+2);L(2:6,2:end-1)=l;O=o(3);O(5)=-8;M=~conv2(kron(L,o(25)),O);imshow(M)

Ini kasus uji pertama (dari tangkapan layar yang diubah ukurannya, sesuai dengan monitor saya =):

o=@ones;
l=z=o(5,1);                   %spacer matrices
for k=input('')-47;           %go throu all input digis
                              %decode the matrices for each digit from decimal
l=[l,reshape(dec2bin([448,22558,8514,10560,3936,2376,328,15840,320,2368](k),15),5,[])-48,z];
end
L=~o(size(l)+2);           %pad the image
L(2:6,2:end-1)=l;
O=o(3);O(5)=-8;               %create edge detection filter
imshow(~conv2(kron(L,o(25)),O)) %image resizing /edge detection (change 25 to any cell size you like)

Input bisa panjang arbitrer, seperti misalnya '07299361548'

Konvolusi adalah kunci kesuksesan.

Javascript ES6, 506 byte

a=>{with(document)with(body.appendChild(createElement`canvas`))with(getContext`2d`){width=height=(a.length+2)*80;scale(20,20);translate(1,1);lineWidth=0.1;beginPath();["oint",...a.map(i=>"05|7agd7|oint 067128a45|oicgmnt 01de25|oil9amnt 01de23fg45|oint 03fh5|68ec6|oint 03fg45|oij78knt 05|9agf9|oij78knt 01dh5|oint 05|78ed7|9agf9|oint 03fg45|78ed7|oint".split` `[i]),"05"].map(i=>{i.split`|`.map(i=>[...i].map((e,i,_,p=parseInt(e,36),l=~~(p/6),r=p%6)=>i?lineTo(l,r):moveTo(l,r)));translate(4,0)});stroke()}}

Tidak Disatukan:

a=>{                                            // anonymous function declaration, accepts array of numbers
  with(document)                                // bring document into scope
  with(body.appendChild(createElement`canvas`)) // create canvas, drop into html body, bring into scope
  with(getContext`2d`){                         // bring graphics context into scope
    width=height=(a.length+2)*80;               // set width and height
    scale(20,20);                               // scale everything to 20x
    translate(1,1);                             // add padding so outline doesn't touch edge of canvas
    lineWidth=0.1;                              // have to scale line width since we scaled 20x
    beginPath();                                // start drawing lines
    ["oint",                                    // beginning "glyph", draws left end of negative space, see below
     ...a.map(i=>`05|7agd7|oint                 // glyphs 0-9 encoded as vertices
                  067128a45|oicgmnt             //   glyphs seperated by " "
                  01de25|oil9amnt               //   lines within each glyph seperated by "|"
                  01de23fg45|oint               //   a single vertex is stored as a base36 char
                  03fh5|68ec6|oint              //     where a number corresponds to one of the verts shown below:
                  03fg45|oij78knt               //        0  6 12 18 24
                  05|9agf9|oij78knt             //        1  7 13 19 25
                  01dh5|oint                    //        2  8 14 20 26
                  05|78ed7|9agf9|oint           //        3  9 15 21 27
                  03fg45|78ed7|oint`            //        4 10 16 22 28
       .split` `[i]),                           //        5 11 17 23 29
     "05"]                                      // end "glyph", draws right end of negative space, see above
      .map(i=>{                                 // for each glyph string
        i.split`|`                              // seperate into list of line strings
          .map(i=>[...i]                        // convert each line string into list of chars
            .map((e,i,_,p=parseInt(e,36),       // convert base36 char to number
                  l=~~(p/6),r=p%6)=>            // compute x y coords of vertex
              i?lineTo(l,r):moveTo(l,r)));      // draw segment
        translate(4,0)});                       // translate origin 4 units to right
    stroke()}}                                  // draw all lines to canvas

Asumsikan ada <body>untuk menambahkan kanvas ke, diuji di Firefox 46.

Contoh run (menugaskan fungsi anonim ke f):

f([1,0,3])

hasil:

Html + JavaScript ES6, 352

Tes menjalankan cuplikan di bawah ini

<canvas id=C></canvas><script>s=prompt(),C.width=-~s.length*80,c=C.getContext("2d"),[...s].map(d=>[30,d*=3,++d,++d].map(w=a=>{for(a=parseInt("vhvivgtlnllv74vnltvlt11vvlvnlv0"[a],36)*2+1,p=1,y=100,i=64;i>>=1;p=b,y-=20)c.moveTo(x+20,y),b=a&i?1:0,c[b-p?'lineTo':'moveTo'](x,y),(a^q)&i&&c.lineTo(x,y-20);q=a,x+=20}),q=63,x=0),w(30),w(0),c.stroke()</script>

Kurang golf

s=prompt(),C.width=-~s.length*80,c=C.getContext("2d"),
w=a=>{
  a=parseInt("vhvivgtlnllv74vnltvlt11vvlvnlv0"[i],36)*2+1
  for(p=1,y=100,i=32;i;p=b,y-=20,i>>=1)
    c.moveTo(x+20,y),
    b=a&i?1:0,
    c[b-p?'lineTo':'moveTo'](x,y),
    (a^q)&i&&c.lineTo(x,y-20)
  q=a 
  x+=20
},
[...s].map(d=>[30,d*=3,++d,++d].map(w),q=63,x=0),
w(30),w(0)
c.stroke()

Java, 768 byte

import java.awt.*;import java.awt.image.*;class G{public static void main(String[]v)throws Exception{int s=20,n=v[0].length(),i=0,j,w=(n*3+n+1)*s,h=5*s,a[][]={{6,7,8},{0,2,3,10,11,12,13},{1,6,8,13},{1,3,6,8},{3,4,5,6,8,9},{3,6,8,11},{6,8,11},{1,2,3,4,6,7,8,9},{6,8},{3,6,8}};BufferedImage o,b=new BufferedImage(w,h,1);Graphics g=b.getGraphics();g.setColor(Color.WHITE);for(;i<n;i++)for(j=0;j<15;j++){int c=j;if(java.util.Arrays.stream(a[v[0].charAt(i)-48]).noneMatch(e->e==c))g.fillRect((1+i*4+j/5)*s,j%5*s,s,s);}o=new BufferedImage(b.getColorModel(),b.copyData(null),0>1,null);for(i=1;i<h-1;i++)for(j=1;j<w-1;j++)if((b.getRGB(j+1,i)|b.getRGB(j-1,i)|b.getRGB(j,i+1)|b.getRGB(j,i-1))<-1)o.setRGB(j,i,-1);javax.imageio.ImageIO.write(o,"png",new java.io.File("a.png"));}}

Tidak disatukan

import java.awt.*;
        import java.awt.image.BufferedImage;

class Q79261 {
    public static void main(String[] v) throws Exception {
        int scale = 20, n = v[0].length(), i = 0, j, width = (n * 3 + n + 1) * scale, height = 5 * scale, values[][] = {{6, 7, 8}, {0, 2, 3, 10, 11, 12, 13}, {1, 6, 8, 13}, {1, 3, 6, 8}, {3, 4, 5, 6, 8, 9}, {3, 6, 8, 11}, {6, 8, 11}, {1, 2, 3, 4, 6, 7, 8, 9}, {6, 8}, {3, 6, 8}};
        BufferedImage output, temp = new BufferedImage(width, height, 1);
        Graphics g = temp.getGraphics();
        g.setColor(Color.WHITE);
        for (; i < n; i++)
            for (j = 0; j < 15; j++) {
                int finalJ = j;
                if (java.util.Arrays.stream(values[v[0].charAt(i) - 48]).noneMatch(e -> e == finalJ))
                    g.fillRect((1 + i * 4 + j / 5) * scale, j % 5 * scale, scale, scale);
            }
        output = new BufferedImage(temp.getColorModel(), temp.copyData(null), 0 > 1, null);
        for (i = 1; i < height - 1; i++)
            for (j = 1; j < width - 1; j++)
                if ((temp.getRGB(j + 1, i) | temp.getRGB(j - 1, i) | temp.getRGB(j, i + 1) | temp.getRGB(j, i - 1)) < -1)
                    output.setRGB(j, i, -1);
        javax.imageio.ImageIO.write(output, "png", new java.io.File("a.png"));
    }
}

Catatan

• Input adalah string tunggal sebagai argumen. Cara menggunakan: javac G.java,java G 80085

• Saya mulai dengan kanvas hitam, lalu saya menambahkan angka sebagai positif putih. Saya membuat salinan gambar dan kemudian membalik setiap piksel hitam yang memiliki 4 tetangga hitam pada gambar asli.

Keluaran

Beberapa digit tunggal:

R, terlalu banyak byte ke golf ( 1530+ 1115)

library(reshape2);library(ggplot2);library(png)
M=matrix(1,5,3)
M=lapply(list(c(7:9),c(1,3,4,11:14),c(2,7,9,14),c(2,4,7,9),c(4:7,9,10),c(4,7,9,12),c(7,9,12),c(2:5,7:10),c(7,9),c(4,7,9)),function(x){M[x]=0;M})
g=function(P){
S=matrix(0,5,1)
R=NULL
for(N in P){R=Reduce(cbind2,list(R,S,M[[N+1]]))}
cbind(R,S)}
p=function(P){
o=t(apply(g(P),1,rev))
ggplot(melt(o),aes(x=Var1,y=Var2))+geom_raster(aes(fill=value))+coord_flip()+scale_fill_continuous(guide=FALSE,high="#FFFFFF",low="#000000")+scale_y_reverse()+scale_x_reverse()+theme_bw()+theme(panel.grid=element_blank(),panel.border=element_blank(),panel.background=element_blank(),axis.title=element_blank(),axis.text=element_blank(),axis.ticks=element_blank(),plot.margin=unit(c(0,0,0,0),"mm"))+ggsave("t.png",width=dim(o)[2]/2.5,height=2,units="in",dpi=99)
q=readPNG("t.png")
k=q[,,1]
b=replace(k,k==1,0)
for(i in 1:nrow(k)){
for(j in 1:ncol(k)){
u=(i==nrow(k))
v=(j==ncol(k))
if(u&v){b[i,j]=1;break}
if((i==1)|u|(j==1)|v){b[i,j]=1;next}else{if(all(k[c((i-1):(i+1)),c((j-1):(j+1))])){b[i,j]=1}else{b[i,j]=0}}}}
q[,,1:3]=abs(replace(k,b==1,0)-1)
writePNG(q,"t.png")}

# run p(c(0,1,2,3,4,5))

lol menulis ke disk, lalu membaca dari disk mengedit isi hitam.

Python 3, 326 325 byte

import numpy
from skimage import io,transform as t,filters as f
r=[[1]*5,[0]*5]
for c in map(int,input()):r+=[map(float,bin(0x3f1fa7e1bd7b5aff84ff6b7fd6f087ff5ff6bf)[2:][15*c+5*i:15*c+5*-~i])for i in[0,1,2]]+[[0]*5]
r+=[[1]*5]
p=[[1]*len(r)]
r=p+list(zip(*r))+p
io.imsave("o.png",1-f.sobel((t.rescale(numpy.array(r),16,0))))

C #, 768 773 776 byte

namespace System.Drawing{class P{static void Main(string[]a){uint[]l={0xEBFBFFFC,0xB89B21B4,0xABFFF9FC,0xAA1269A4,0xFFF3F9FC};var w=a[0].Length*80+20;var b=new Bitmap(w,100);var g=Graphics.FromImage(b);g.FillRectangle(Brushes.Black,0,0,w,100);for(int i=0;i<a[0].Length;i++)for(int r=0;r<5;r++)for(int c=0;c<3;c++)if((l[r]&((uint)1<<(175-a[0][i]*3-c)))>0)g.FillRectangle(Brushes.White,20*(1+i*4+c),20*r,20,20);for(int x=1;x<w-1;x++)for(int y=1;y<99;y++)if(b.GetPixel(x,y).B+b.GetPixel(x+1,y).B+b.GetPixel(x,y+1).B+b.GetPixel(x,y-1).B+b.GetPixel(x+1,y-1).B+b.GetPixel(x+1,y+1).B+b.GetPixel(x-1,y+1).B+b.GetPixel(x-1,y-1).B==0)b.SetPixel(x,y,Color.Red);for(int x=1;x<w-1;x++)for(int y=1;y<99;y++)if(b.GetPixel(x,y).R>0)b.SetPixel(x,y,Color.White);b.Save(a[0]+".bmp");}}}

Mengambil nomor sebagai argumen baris perintah. Menghasilkan gambar BMP yang bagus, bersih, tanpa alias dengan nomor sesuai namanya.

Asli sebelum bermain golf:

namespace System.Drawing
{
    class P
    {
        static void Main(string[] args)
        {
            var numbers = args[0];
            uint[] lines = {
                0xEBFBFFFC, // 111 010 111 111 101 111 111 111 111 111 00
                0xB89B21B4, // 101 110 001 001 101 100 100 001 101 101 00
                0xABFFF9FC, // 101 010 111 111 111 111 111 001 111 111 00
                0xAA1269A4, // 101 010 100 001 001 001 101 001 101 001 00
                0xFFF3F9FC  // 111 111 111 111 001 111 111 001 111 111 00
            };
            var width = numbers.Length*4 + 1;
            var bmp = new Bitmap(width*20, 5*20);
            using (var gfx = Graphics.FromImage(bmp))
            {
                gfx.FillRectangle(Brushes.Black, 0, 0, width*20+2, 5*20+2);
                // Process all numbers
                for (int i = 0; i < numbers.Length; i++)
                {
                    var number = numbers[i]-'0';
                    for (int line = 0; line < 5; line++)
                    {
                        for (int col = 0; col < 3; col++)
                        {
                            if ((lines[line] & ((uint)1<<(31-number*3-col))) >0)
                                gfx.FillRectangle(Brushes.White, 20*(1 + i * 4 + col), 20*line, 20 , 20 );
                        }
                    }
                }
                // Edge detection
                for (int x = 1; x < width*20-1; x++)
                {
                    for (int y = 1; y < 5*20-1 ; y++)
                    {
                        if (bmp.GetPixel(x,y).B +
                            bmp.GetPixel(x + 1, y).B +
                                bmp.GetPixel(x, y + 1).B +
                                bmp.GetPixel(x, y - 1).B +
                                bmp.GetPixel(x + 1, y - 1).B +
                                bmp.GetPixel(x + 1, y + 1).B + 
                                bmp.GetPixel(x - 1, y + 1).B + 
                                bmp.GetPixel(x - 1, y - 1).B == 0)
                                bmp.SetPixel(x, y, Color.Red);
                    }
                }
                // Convert red to white
                for (int x = 1; x < width * 20 - 1; x++)
                {
                    for (int y = 1; y < 5 * 20 - 1; y++)
                    {
                        if (bmp.GetPixel(x, y).R>0)
                            bmp.SetPixel(x, y, Color.White);
                    }
                }
            }
            bmp.Save(@"c:\tmp\test.bmp");
        }
    }
}

Mathematica 328 byte

j@d_:=Partition[IntegerDigits[FromDigits[d/.Thread[ToString/@Range[0,9]->StringPartition["75557262277174771717557117471774757711117575775717",5]],16],2, 20]/.{0->1,1->0},4];j@"*"=Array[{1}&,5];
w@s_:=  ColorNegate@EdgeDetect@Rasterize@ArrayPlot[Thread[Join@@Transpose/@j/@Characters@(s<>"*")],Frame->False,ImageSize->Large]

w["07299361548"]
w["19887620534"]

Penjelasan

Empat bit akan digunakan di masing-masing 5 baris sel untuk setiap digit input.

"75557262277174771717557117471774757711117575775717"mewakili 0 hingga 9 sebagai bitmap.

5 digit pertama dalam bilangan bulat besar di atas, yaitu 75557menunjukkan bagaimana setiap baris array untuk nol harus ditampilkan. 7akan mewakili {0,1,1,1}, yaitu, sel putih, diikuti, di sebelah kanannya, oleh 3 sel hitam; yang terdepan 0adalah ruang kosong untuk memisahkan angka yang ditampilkan. 5sesuai dengan {0,1,0,1}, yaitu sel putih, hitam, putih, hitam.

Berikut ini menghasilkan daftar aturan penggantian:

Thread[ToString /@ Range[0, 9] -> StringPartition["75557262277174771717557117471774757711117575775717", 5]]

{"0" -> "75557", "1" -> "26227", "2" -> "71747", "3" -> "71717", "4" -> "55711", "5" - > "74717", "6" -> "74757", "7" -> "71111", "8" -> "75757", "9" -> "75717"}

Perhatikan bahwa ketika 3input, itu akan diganti oleh 71717 Representasi ini dinyatakan dalam biner:

p = Partition[IntegerDigits[FromDigits["3" /. {"3" -> "71717"}, 16], 2, 20], 4]

{{0, 1, 1, 1}, {0, 0, 0, 1}, {0, 1, 1, 1}, {0, 0, 0, 1}, {0, 1, 1, 1}} }

Kebalikan hitam-putihnya ditemukan hanya dengan menukar 1s dan 0s.

q = p /. {0 -> 1, 1 -> 0}

{{1, 0, 0, 0}, {1, 1, 1, 0}, {1, 0, 0, 0}, {1, 1, 1, 0}, {1, 0, 0, 0} }

Mari kita lihat seperti apa pdan qketika ditampilkan oleh ArrayPlot:

ArrayPlot[#, Mesh -> True, ImageSize -> Small, PlotLegends -> Automatic] & /@ {p, q}

Ini hanya bergabung dengan array nol dan satu untuk setiap digit sebelum merender array besar via ArrayPlot. *didefinisikan jsebagai ruang vertikal akhir setelah digit terakhir.

Thread[Join @@ Transpose /@ j /@ Characters@(s <> "*")]