After a certain pixel size javascript generated PNG image stops working

Question

I am generating a 1-bit monochrome png image in javascript from an array of values. Depending on where I am viewing the image there seems to be a max size before the image stops displaying. If I am in chrome it will display up to around 150px X 150px, safari stops working at 61px X 61px, and then if I download it from chrome (right click save or copy base64 string to a hexeditor and download it) it will display up to 72px X 72px.

When it stops working it just displays garbage. I'm wondering if there is something wrong with my file formatting that is making it not recognizable on all the programs.

Here it is working in the browser.

Here is what it looks like in Preview when it is right clicked and downloaded. (Mac os)

Here is the actual file itself (displays fine in stackoverflow):

This is the base64 encoded string using https://github.com/beatgammit/base64-js:

iVBORw0KGgoAAAANSUhEUgAAAJYAAACWAQAAAAAUekxPAAA8DklEQVR4nOXVTWvjRhgAYJlAfWiwCr0U6vX8hYAPDsSrOfZ3tBR6LfSwpCiagA/OQru+tiy2fkQvDauNvLisyMHxoSdjy+OsDiE0iSQEa7kezXQ+pKw3DnQpZdlSH6TRY8/H+3r0jsY2PlB7r+bJKy1zI5qmy6e2vKYlYdXKukWaMAt01voGc2EUjMQDUqNeRNwyCsI1C9M3RnNjwhgFoknuGmZeChmLObClMlpin0TlQdxnc8C/kEa+pSYxtvqHqKOxQNkyNS2CWtEutMuspSwmTW6DyISgzTRlSW6UG9GQtPO0CXPz2FzZXGvqt5ZCaQGjW8p0j5HCWCm30ZodKmt3GL21uSltAAo755E3pfURT1BuXaIMiwRJi9hDqszmpuKIjCZtQrk+dpHnL9VM0/x0EBGo6S9krtIy0UjTLLfmKdC2+uI/Z/MSj6JEK1p/Rz8s8aze2S/2+eYegtmGUbRp5F5bbZpIx93x5Fa8M68GN00t6D3bAhVGvhD3hO/9C1gYXYj7yua/u+1LE2noLVtUf/1y8CeqPHi08z3K7evhsf9LSoeTRb1RWHW0h+updT1esyzbw3BlZORRvV4YyZ5x6y1po75XzEEunw6frs7MSaPeKNZsVUuBF7dqu1/Vd+BmvAt308J7bI7eJVf/jlHI4uA1cIkenDMLqDgw2h+SH3BT9wNqQWlZiLLZ9TB0cRezA9V3GVpZL7zk5njYREniSlv22Gno2k6ALfj4yBaGlj08Dl3XWTJkT30s7ID08LGwjCFcGO2x/dBFb4zPS2cnGbeuMF8YwXv+0NnGLvKf4X1XGjU+HwSkYtRY0J59hgZHnY148T05uM/sD+Nd+AeWPlStHKCwfkm0UxjBLf7270pri9rDy2OKxNliSNNjZUQaFcbLfWH8bIHKZI3KjSojUIzFXgmjJqCQ11N+6KT6K3iEuGnNbcOA0hJvpBvCWjUrt/43gf3EEtapIbkWgiIvsF8q6xUWezH47e8N3tqoMHqfgdhL9LeN5yBIOmcGjwN3elBZOw4uvCdVHqnd6TXkmtmLVuwFQAO8cLYrlVpNWKQTEKGX/ExiH+nVbR19YHvjP2iUgkX/dW02A39MyANXWubb302zH/0z5vvZz1hZOEpoOLy+Yt3uaqJsGZ4lWXh5NYXOKZ7g1u9A2CzJ2OkNBM4Aj/HjI1lz7CTD4xuAnYAdF7XpebLCx1cd7IyZA4ralKzYwfUIO8+LGpbdsGR1kg1D3O1SpuoQmX6cLJzt6Sl/nOpo3B3xOJrciH5SRUEwrbLBT6P/YW16N/sLp9scOoQvZQ4AAAAASUVORK5CYII=

This is the hex-output of the file I create before I convert it to base64:

89 50 4E 47 D A 1A A 0 0 0 D 49 48 44 52 0 0 0 96 0 0 0 96 1 0 0 0 0 14 7A 4C 4F 0 0 3C E 49 44 41 54 78 9C E5 D5 4D 6B E3 46 18 0 60 99 40 7D 68 B0 A BD 14 EA F5 FC 85 80 F E C4 AB 39 F6 77 B4 14 7A 2D F4 B0 A4 28 9A 80 F CE 42 BB BE B6 2C B6 7E 44 2F D AB 8D BC B8 AC C8 C1 F1 A1 27 63 CB E3 AC E 21 34 89 24 4 6B B9 1E CD 74 3E A4 AC 37 E 74 29 65 D9 52 1F A4 D1 63 CF C7 FB 7A F4 8E C6 36 3E 50 7B AF E6 C9 2B 2D 73 23 9A A6 CB A7 B6 BC A6 25 61 D5 CA BA 45 9A 30 B 74 D6 FA 6 73 61 14 8C C4 3 52 A3 5E 44 DC 32 A C2 35 B D3 37 46 73 63 C2 18 5 A2 49 EE 1A 66 5E A 19 8B 39 B0 A5 32 5A 62 9F 44 E5 41 DC 67 73 C0 BF 90 46 BE A5 26 31 B6 FA 87 A8 A3 B1 40 D9 32 35 2D 82 5A D1 2E B4 CB AC A5 2C 26 4D 6E 83 C8 84 A0 CD 34 65 49 6E 94 1B D1 90 B4 F3 B4 9 73 F3 D8 5C D9 5C 6B EA B7 96 42 69 1 A3 5B CA 74 8F 91 C2 58 29 B7 D1 9A 1D 2A 6B 77 18 BD B5 B9 29 6D 0 A 3B E7 91 37 A5 F5 11 4F 50 6E 5D A2 C 8B 4 49 8B D8 43 AA CC E6 A6 E2 88 8C 26 6D 42 B9 3E 76 91 E7 2F D5 4C D3 FC 74 10 11 A8 E9 2F 64 AE D2 32 D1 48 D3 2C B7 E6 29 D0 B6 FA E2 3F 67 F3 12 8F A2 44 2B 5A 7F 47 3F 2C F1 AC DE D9 2F F6 F9 E6 1E 82 D9 86 51 B4 69 E4 5E 5B 6D 9A 48 C7 DD F1 E4 56 BC 33 AF 6 37 4D 2D E8 3D DB 2 15 46 BE 10 F7 84 EF FD B 58 18 5D 88 FB CA E6 BF BB ED 4B 13 69 E8 2D 5B 54 7F FD 72 F0 27 AA 3C 78 B4 F3 3D CA ED EB E1 B1 FF 4B 4A 87 93 45 BD 51 58 75 B4 87 EB A9 75 3D 5E B3 2C DB C3 70 65 64 E4 51 BD 5E 18 C9 9E 71 EB 2D 69 A3 BE 57 CC 41 2E 9F E 9F AE CE CC 49 A3 DE 28 D6 6C 55 4B 81 17 B7 6A BB 5F D5 77 E0 66 BC B 77 D3 C2 7B 6C 8E DE 25 57 FF 8E 51 C8 E2 E0 35 70 89 1E 9C 33 B A8 38 30 DA 1F 92 1F 70 53 F7 3 6A 41 69 59 88 B2 D9 F5 30 74 71 17 B3 3 D5 77 19 5A 59 2F BC E4 E6 78 D8 44 49 E2 4A 5B F6 D8 69 E8 DA 4E 80 2D F8 F8 C8 16 86 96 3D 3C E 5D D7 59 32 64 4F 7D 2C EC 80 F4 F0 B1 B0 8C 21 5C 18 ED B1 FD D0 45 6F 8C CF 4B 67 27 19 B7 AE 30 5F 18 C1 7B FE D0 D9 C6 2E F2 9F E1 7D 57 1A 35 3E 1F 4 A4 62 D4 58 D0 9E 7D 86 6 47 9D 8D 78 F1 3D 39 B8 CF EC F E3 5D F8 7 96 3E 54 AD 1C A0 B0 7E 49 B4 53 18 C1 2D FE F6 EF 4A 6B 8B DA C3 CB 63 8A C4 D9 62 48 D3 63 65 44 1A 15 C6 CB 7D 61 FC 6C 81 CA 64 8D CA 8D 2A 23 50 8C C5 5E 9 A3 26 A0 90 D7 53 7E E8 A4 FA 2B 78 84 B8 69 CD 6D C3 80 D2 12 6F A4 1B C2 5A 35 2B B7 FE 37 81 FD C4 12 D6 A9 21 B9 16 82 22 2F B0 5F 2A EB 15 16 7B 31 F8 ED EF D DE DA A8 30 7A 9F 81 D8 4B F4 B7 8D E7 20 48 3A 67 6 8F 3 77 7A 50 59 3B E 2E BC 27 55 1E A9 DD E9 35 E4 9A D9 8B 56 EC 5 40 3 BC 70 B6 2B 95 5A 4D 58 A4 13 10 A1 97 FC 4C 62 1F E9 D5 6D 1D 7D 60 7B E3 3F 68 94 82 45 FF 75 6D 36 3 7F 4C C8 3 57 5A E6 DB DF 4D B3 1F FD 33 E6 FB D9 CF 58 59 38 4A 68 38 BC BE 62 DD EE 6A A2 6C 19 9E 25 59 78 79 35 85 CE 29 9E E0 D6 EF 40 D8 2C C9 D8 E9 D 4 CE 0 8F F1 E3 23 59 73 EC 24 C3 E3 1B 80 9D 80 1D 17 B5 E9 79 B2 C2 C7 57 1D EC 8C 99 3 8A DA 94 AC D8 C1 F5 8 3B CF 8B 1A 96 DD B0 64 75 92 D 43 DC ED 52 A6 EA 10 99 7E 9C 2C 9C ED E9 29 7F 9C EA 68 DC 1D F1 38 9A DC 88 7E 52 45 41 30 AD B2 C1 4F A3 FF 61 6D 7A 37 FB B A7 DB 1C 3A 84 2F 65 E 0 0 0 0 49 45 4E 44 AE 42 60 82

Any help you guys could give me would really be appreciated. Thanks in advance.

Answer 1

Solved the problem. When I checked with PNG check it turned out I was using the wrong size for the IDAT chunk. I had a bug in my decimal to byte array converter. I was accidentally left-shifting some of the values if there wasn't an even number of bytes.