Tags: vercel/satori
Tags
fix: clear inflight request map for image resolution (#651) Closes #650 ## Current behavior Try changing the background color in the `main` [playground link](https://og-playground.vercel.app/?share=7VVdb9owFP0rlvfSScH5BEIEnVZUqZ3UrZ2qTZN4CYmTmDpxZhsCQ_z33XxBqvVp2uOMUHyvj-899_o4OeJIxBQHeB6z3apASOkDp4vjsZ4jFDNV8vAQoBVOON2vsNH6N1ulWXJYikLTQtfLETypPANCztLiXtNcvVpE7WrFYp0FyLasDp5RlmYQ5-JZh9FLKsW2iJeCC1lH0TIsVBlKCNblOZ1WxXU9matdOgi9OEIgWLuEHnp2jFY3Yr9YYQtZyHbHZDbzfB_ZzoRMYExXuAXuc14ogGVal4FpVlVFKpcImZqOZVlmnbNBNhSAREwT1c3BijgrH0OdIRZDDADXxgqfAQApa8_ZRKipMBEyhw15qCXbX9nEbYdhwW90Mf0x8WzLn0wMp2ENvN_3xNtRp80RbEMZGkFttoMiNPKJPfXAN7LHZOpMjZFH3IkN5oz4tgcZbOJ5iIPDJdbEGDkQvtnoEcsH-JRY09nZgiC-ZUOSGgc95NDPwbYlAG3ie4D0obkubHQ94swgzwxyNqSa6R2cRIR6bh21lllHrOfVxu9ZtTRaTu38zKgn1BXSE3pddp8RujRs3vXcrM_mcphmf5r9WZuDw56zPExpj80kTTrRKFBNEirND6RkkdrmpMyEFspksemM_VpGpmtZZFOmH7I8jBaP019bb3bzqXq6u9t8vp08OvffHKofnp65-LJ2ntY8_-mz_XL00EnvTcm_JXqESkkVlTv6UZU00l9DzQTQ3D-w-Af8keIsopegfb0A2Up-9a7T71li0KGm6r4FQyknjHPYV4hiEFBpKV4ouKuM6T_839saxme2_-4q_L8Gf3UNhldgXr_rYAaqZ7trbGBRgnoKhYMjbtSHAx_e3LiVHQ682ojpepviIAm5ogamudiw50NZf2t01VgQJ4EPyG2-pjEOtNzSk4F1uAZERjkXlZA8xqff). See this comment for [explanation](#650 (comment)) of why this is happening. ## Proposed behavior Try changing the background color in this branch's [playground link](https://satori-playground-git-fork-erxclau-clear-image-inflight-6f2758.vercel.sh/?share=7VVdb9owFP0rlvfSScH5BEIEnVZUqZ3UrZ2qTZN4CYmTmDpxZhsCQ_z33XxBqvVp2uOMUHyvj-899_o4OeJIxBQHeB6z3apASOkDp4vjsZ4jFDNV8vAQoBVOON2vsNH6N1ulWXJYikLTQtfLETypPANCztLiXtNcvVpE7WrFYp0FyLasDp5RlmYQ5-JZh9FLKsW2iJeCC1lH0TIsVBlKCNblOZ1WxXU9matdOgi9OEIgWLuEHnp2jFY3Yr9YYQtZyHbHZDbzfB_ZzoRMYExXuAXuc14ogGVal4FpVlVFKpcImZqOZVlmnbNBNhSAREwT1c3BijgrH0OdIRZDDADXxgqfAQApa8_ZRKipMBEyhw15qCXbX9nEbYdhwW90Mf0x8WzLn0wMp2ENvN_3xNtRp80RbEMZGkFttoMiNPKJPfXAN7LHZOpMjZFH3IkN5oz4tgcZbOJ5iIPDJdbEGDkQvtnoEcsH-JRY09nZgiC-ZUOSGgc95NDPwbYlAG3ie4D0obkubHQ94swgzwxyNqSa6R2cRIR6bh21lllHrOfVxu9ZtTRaTu38zKgn1BXSE3pddp8RujRs3vXcrM_mcphmf5r9WZuDw56zPExpj80kTTrRKFBNEirND6RkkdrmpMyEFspksemM_VpGpmtZZFOmH7I8jBaP019bb3bzqXq6u9t8vp08OvffHKofnp65-LJ2ntY8_-mz_XL00EnvTcm_JXqESkkVlTv6UZU00l9DzQTQ3D-w-Af8keIsopegfb0A2Up-9a7T71li0KGm6r4FQyknjHPYV4hiEFBpKV4ouKuM6T_839saxme2_-4q_L8Gf3UNhldgXr_rYAaqZ7trbGBRgnoKhYMjbtSHAx_e3LiVHQ682ojpepviIAm5ogamudiw50NZf2t01VgQJ4EPyG2-pjEOtNzSk4F1uAZERjkXlZA8xqff). ## Related This is related to #593 and #592 (#592 (comment) and #592 (comment)). The error in #592 is no longer thrown, though the image still does not render in PNG mode ([link](https://satori-playground-git-fork-erxclau-clear-image-inflight-6f2758.vercel.sh/?share=7VVdb9owFP0rlvfSScH5BEIEnVZUqZ3UrZ2qTZN4CYmTmDpxZhsCQ_z33XxBqvVp2uOMUHyvj-899_o4OeJIxBQHeB6z3apASOkDp4vjsZ4jFDNV8vAQoBVOON2vsNH6N1ulWXJYikLTQtfLETypPANCztLiXtNcvVpE7WrFYp0FyLasDp5RlmYQ5-JZh9FLKsW2iJeCC1lH0TIsVBlKCNblOZ1WxXU9matdOgi9OEIgWLuEHnp2jFY3Yr9YYQtZyHbHZDbzfB_ZzoRMYExXuAXuc14ogGVal4FpVlVFKpcImZqOZVlmnbNBNhSAREwT1c3BijgrH0OdIRZDDADXxgqfAQApa8_ZRKipMBEyhw15qCXbX9nEbYdhwW90Mf0x8WzLn0wMp2ENvN_3xNtRp80RbEMZGkFttoMiNPKJPfXAN7LHZOpMjZFH3IkN5oz4tgcZbOJ5iIPDJdbEGDkQvtnoEcsH-JRY09nZgiC-ZUOSGgc95NDPwbYlAG3ie4D0obkubHQ94swgzwxyNqSa6R2cRIR6bh21lllHrOfVxu9ZtTRaTu38zKgn1BXSE3pddp8RujRs3vXcrM_mcphmf5r9WZuDw56zPExpj80kTTrRKFBNEirND6RkkdrmpMyEFspksemM_VpGpmtZZFOmH7I8jBaP019bb3bzqXq6u9t8vp08OvffHKofnp65-LJ2ntY8_-mz_XL00EnvTcm_JXqESkkVlTv6UZU00l9DzQTQ3D-w-Af8keIsopegfb0A2Up-9a7T71li0KGm6r4FQyknjHPYV4hiEFBpKV4ouKuM6T_839saxme2_-4q_L8Gf3UNhldgXr_rYAaqZ7trbGBRgnoKhYMjbtSHAx_e3LiVHQ682ojpepviIAm5ogamudiw50NZf2t01VgQJ4EPyG2-pjEOtNzSk4F1uAZERjkXlZA8xqff)).
feat: add ability to add text stroke (#645)  This PR is adding ability to stroke to texts. fixes: #578 Added 2 properties (`WebkitTextStrokeWidth`, `WebkitTextStrokeColor`) and 1 shorthands (`WebkitTextStroke`). When stroke is enabled, `paint-order: stroke;` and `stroke-linejoin: round;` are automatically set to prevent the stroke from obscuring the text. I don't have a deep understanding of all the code so further improvements may be needed.
feat: support `repeating-linear-gradient` (#630) Now that #624 has been merged, let me bring`repeating-linear-gradient` to satori~ ❤️ Close #554 Note about the algorithm: <hr> Option 1: `0 < deg < 90` define ```math r=(h/w)^2 ``` then, calculate the intersection point of the last two lines ```math y = - r / tan(angle) ·x + w / 2 + h/2+r·w/ (2·tan(angle)) ``` ```math y=tan(angle) ·x + h ``` Finally, we can get `(x1, y1)`, `(x2, y2)` about length: ```math y = - 1 / tan(angle) ·x + w / 2 + h/2+r·w/ (2·tan(angle)) ``` ```math y=tan(angle) ·x + h ``` then, we can get a point: `(a, b)`, so length is $`2 ·\sqrt{(a - w/2)^2 + (b - h/2)^2}`$ <hr> Option 2: `90 < deg < 180` define ```math r=(h/w)^2 ``` then, calculate the intersection point of the last two lines ```math y = - r / tan(angle) ·x + w / 2 + h/2+r·w/ (2·tan(angle)) ``` ```math y=tan(angle) ·x ``` Finally, we can get `(x1, y1)`, `(x2, y2)` about length: ```math y = - 1 / tan(angle) ·x + w / 2 + h/2+r·w/ (2·tan(angle)) ``` ```math y=tan(angle) ·x ``` then, we can get a point: `(a, b)`, so length is $`2 ·\sqrt{(a - w/2)^2 + (b - h/2)^2}`$ Actually, I didn't find any spec of the algorithm on calculating the points. I just came across the algorithm accidentally. It turns out it shows the same result just like chrome renders.
PreviousNext