How to mask an image with Active Storage and mini_magick
up vote
0
down vote
favorite
I'm trying to create an avatar that is circular instead of a rectangle.
The rails code below successfully resizes and crops the image. I'm using Active Storage to upload the file. However I'm struggling to apply a mask to it.
I was trying to composite and use the mini_magick_clip gem, but neither works. Maybe it's just a syntax error, but I couldn't find any examples on the web.
Do you have suggestions on how best to achieve such a circular avatar?
# app/models/comment.rb
class Signature < ApplicationRecord
has_one_attached :image
require "mini_magick"
# require "mini_magick_clip"
def avatar
mask = MiniMagick::Image.open "public/mask.png"
upload = self.image
avatar = upload.variant(
combine_options: {
resize: "160x160^",
gravity: "center",
extent: "160x160",
# mask: mask,
}
).processed
end
end
ruby-on-rails mask minimagick rails-activestorage
add a comment |
up vote
0
down vote
favorite
I'm trying to create an avatar that is circular instead of a rectangle.
The rails code below successfully resizes and crops the image. I'm using Active Storage to upload the file. However I'm struggling to apply a mask to it.
I was trying to composite and use the mini_magick_clip gem, but neither works. Maybe it's just a syntax error, but I couldn't find any examples on the web.
Do you have suggestions on how best to achieve such a circular avatar?
# app/models/comment.rb
class Signature < ApplicationRecord
has_one_attached :image
require "mini_magick"
# require "mini_magick_clip"
def avatar
mask = MiniMagick::Image.open "public/mask.png"
upload = self.image
avatar = upload.variant(
combine_options: {
resize: "160x160^",
gravity: "center",
extent: "160x160",
# mask: mask,
}
).processed
end
end
ruby-on-rails mask minimagick rails-activestorage
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
I'm trying to create an avatar that is circular instead of a rectangle.
The rails code below successfully resizes and crops the image. I'm using Active Storage to upload the file. However I'm struggling to apply a mask to it.
I was trying to composite and use the mini_magick_clip gem, but neither works. Maybe it's just a syntax error, but I couldn't find any examples on the web.
Do you have suggestions on how best to achieve such a circular avatar?
# app/models/comment.rb
class Signature < ApplicationRecord
has_one_attached :image
require "mini_magick"
# require "mini_magick_clip"
def avatar
mask = MiniMagick::Image.open "public/mask.png"
upload = self.image
avatar = upload.variant(
combine_options: {
resize: "160x160^",
gravity: "center",
extent: "160x160",
# mask: mask,
}
).processed
end
end
ruby-on-rails mask minimagick rails-activestorage
I'm trying to create an avatar that is circular instead of a rectangle.
The rails code below successfully resizes and crops the image. I'm using Active Storage to upload the file. However I'm struggling to apply a mask to it.
I was trying to composite and use the mini_magick_clip gem, but neither works. Maybe it's just a syntax error, but I couldn't find any examples on the web.
Do you have suggestions on how best to achieve such a circular avatar?
# app/models/comment.rb
class Signature < ApplicationRecord
has_one_attached :image
require "mini_magick"
# require "mini_magick_clip"
def avatar
mask = MiniMagick::Image.open "public/mask.png"
upload = self.image
avatar = upload.variant(
combine_options: {
resize: "160x160^",
gravity: "center",
extent: "160x160",
# mask: mask,
}
).processed
end
end
# app/models/comment.rb
class Signature < ApplicationRecord
has_one_attached :image
require "mini_magick"
# require "mini_magick_clip"
def avatar
mask = MiniMagick::Image.open "public/mask.png"
upload = self.image
avatar = upload.variant(
combine_options: {
resize: "160x160^",
gravity: "center",
extent: "160x160",
# mask: mask,
}
).processed
end
end
# app/models/comment.rb
class Signature < ApplicationRecord
has_one_attached :image
require "mini_magick"
# require "mini_magick_clip"
def avatar
mask = MiniMagick::Image.open "public/mask.png"
upload = self.image
avatar = upload.variant(
combine_options: {
resize: "160x160^",
gravity: "center",
extent: "160x160",
# mask: mask,
}
).processed
end
end
ruby-on-rails mask minimagick rails-activestorage
ruby-on-rails mask minimagick rails-activestorage
asked Nov 4 at 9:48
Ivan Raszl
1
1
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
I'd suggest storing and serving your avatars in their original shape. It's easy to make them look circular (or whatever shape you want) using CSS. You can find related question here and an example here.
Thank you! But it's not a good solution, because I want to use these images in email signatures, and some email applications do not support advanced CSS. It has to be as basic as possible for maximum compatibility.
– Ivan Raszl
Nov 4 at 12:01
Well, in that case CSS really isn't the right solution.
– ahawrylak
Nov 4 at 12:07
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
I'd suggest storing and serving your avatars in their original shape. It's easy to make them look circular (or whatever shape you want) using CSS. You can find related question here and an example here.
Thank you! But it's not a good solution, because I want to use these images in email signatures, and some email applications do not support advanced CSS. It has to be as basic as possible for maximum compatibility.
– Ivan Raszl
Nov 4 at 12:01
Well, in that case CSS really isn't the right solution.
– ahawrylak
Nov 4 at 12:07
add a comment |
up vote
0
down vote
I'd suggest storing and serving your avatars in their original shape. It's easy to make them look circular (or whatever shape you want) using CSS. You can find related question here and an example here.
Thank you! But it's not a good solution, because I want to use these images in email signatures, and some email applications do not support advanced CSS. It has to be as basic as possible for maximum compatibility.
– Ivan Raszl
Nov 4 at 12:01
Well, in that case CSS really isn't the right solution.
– ahawrylak
Nov 4 at 12:07
add a comment |
up vote
0
down vote
up vote
0
down vote
I'd suggest storing and serving your avatars in their original shape. It's easy to make them look circular (or whatever shape you want) using CSS. You can find related question here and an example here.
I'd suggest storing and serving your avatars in their original shape. It's easy to make them look circular (or whatever shape you want) using CSS. You can find related question here and an example here.
answered Nov 4 at 10:24
ahawrylak
1388
1388
Thank you! But it's not a good solution, because I want to use these images in email signatures, and some email applications do not support advanced CSS. It has to be as basic as possible for maximum compatibility.
– Ivan Raszl
Nov 4 at 12:01
Well, in that case CSS really isn't the right solution.
– ahawrylak
Nov 4 at 12:07
add a comment |
Thank you! But it's not a good solution, because I want to use these images in email signatures, and some email applications do not support advanced CSS. It has to be as basic as possible for maximum compatibility.
– Ivan Raszl
Nov 4 at 12:01
Well, in that case CSS really isn't the right solution.
– ahawrylak
Nov 4 at 12:07
Thank you! But it's not a good solution, because I want to use these images in email signatures, and some email applications do not support advanced CSS. It has to be as basic as possible for maximum compatibility.
– Ivan Raszl
Nov 4 at 12:01
Thank you! But it's not a good solution, because I want to use these images in email signatures, and some email applications do not support advanced CSS. It has to be as basic as possible for maximum compatibility.
– Ivan Raszl
Nov 4 at 12:01
Well, in that case CSS really isn't the right solution.
– ahawrylak
Nov 4 at 12:07
Well, in that case CSS really isn't the right solution.
– ahawrylak
Nov 4 at 12:07
add a comment |
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53139505%2fhow-to-mask-an-image-with-active-storage-and-mini-magick%23new-answer', 'question_page');
}
);
Post as a guest
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password