친구가 나에게 전화 사진과 스크린샷을 보내고 목록을 위해 하나의 이미지에서 요청했습니다. 나는 자신의 크기로 캔버스에 둘 다 떨어뜨렸고 아무도 받아들이지 않을 수 있는 것을 얻었습니다. 옆에 좁은 1170 x 2532 스크린샷이 있는 4032 x 3024 사진, 스크린샷 아래에 빈 흰색 밴드, 전체 5202 픽셀 너비. 사진은 괜찮았습니다. 두 파일이 거의 차원을 공유하지 않기 때문에 배열이 문제였으며 매번 동일한 문제입니다. 어떤 축이 정렬되어야 하는지 결정하는 것이 전체 작업이고 다른 모든 것이 그 뒤를 따릅니다.
TL;DR: 이미지 병합은 그리기 전에 확장 결정입니다. 나란히 모든 사진을 가장 높은 높이와 일치시켜 가장 넓은 너비에 일치를 쌓고 그리드가 둘 다 일치하므로 그리드도 자르기와 공간 남기기 중에서 선택해야 하는 이유입니다. 1170x2532 스크린샷 옆의 4032x3024 사진에서 측정: 나란히 5429x3024 캔버스를 생성하고 1397x3024로 확대한 스크린샷이 있는 5429x3024 캔버스를 생성하고, 스태킹은 3.4배의 계수로 확대된 스크린샷과 함께 4032x11750 캔버스를 생성하고, 커버 모드에서 2-셀 그리드는 70.2%의 사진과 49.2%를 유지합니다. 보존하려는 축으로 모드를 선택합니다. 그만큼 이미지 병합 브라우저 탭에 모든 것을 그려서 아무것도 업로드되지 않습니다.
병합된 이미지가 잘못된 것처럼 보이는 이유는 무엇입니까?
입력이 다른 모양이고 대부분의 도구가 도착한 크기에 관계없이 그립니다.
전화 사진은 4032 x 3024입니다. 폰 스크린샷은 1170 x 2532입니다. 스캔은 스캐너가 결정한 대로입니다. 이 중 하나를 기본 크기로 연속으로 배치하고 그 중 하나는 다른 것 위에 우뚝 솟아 있으며 더 큰 차원의 남은 모든 것을 채울 사각형이 있습니다. 그것은 레이아웃이 아니라 실수로 읽습니다. 심지어 당신에게 이유를 말할 수 없는 사람에게도.
수정은 정규화하는 것이며 유일한 질문은 어떤 축에 관한 것입니다. 연속적으로, 상의와 하의는 눈이 따라가는 것이므로 높이가 일치해야 하며 각 사진은 자신의 가로 세로 비율이 부여하는 너비를 취합니다. 열에서 왼쪽과 오른쪽 가장자리가 선이므로 너비가 대신 일치합니다. 그리드에는 두 개의 가장자리가 모두 고정되어 있으므로 두 가지 모두와 일치해야 하며, 이것이 바로 제공해야 하는 모드입니다.
그것이 전체 디자인입니다. 아래의 모든 것이 그 다음입니다.
키가 큰 스크린샷에 나란히 무엇을 합니까?
때로는 원하는 것보다 더 크게 확대됩니다.
다음은 추정치가 아닌 레이아웃 코드에서 가져온 위의 쌍에 대한 측정 결과입니다.
| 모드 | 캔버스 | 에서 그린 사진 | 에서 그린 스크린샷 |
|---|---|---|---|
| 나란히 | 5429 x 3024 | 4032 x 3024 | 1397 x 3024 |
| 한 덩어리로 | 4032 x 11750 | 4032 x 3024 | 4032 x 8726 |
두 높이 중 키가 더 큰 3024와 나란히 일치했기 때문에 스크린샷은 2532에서 3024 픽셀로 증가했습니다. 그것은 19% 확대이며, 텍스트의 스크린샷에서 당신이 그것을 찾으면 볼 수 있고 그렇지 않으면 보이지 않는 경우에 볼 수 있습니다.
스태킹은 극적인 것입니다. 더 넓은 이미지와 일치하면 너비가 1170에서 4032픽셀로 3.4배로 3.4의 스크린샷이 나왔고 캔버스는 높이가 11,750픽셀이었습니다. 스크린샷은 이제 매우 긴 이미지에서 지배적인 개체이며 그 안에 있는 모든 문자는 3번 이상 확장되어 아무리 많은 리샘플링을 해도 선명하게 만들지 않습니다.
하나의 모드가 더 낫다는 교훈은 아닙니다. 모드가 어떤 사진을 확대할지 결정하므로 이미지가 이미 일치하는 축을 선택합니다. 가로에서 두 개의 전화 사진은 높이를 공유하고 크기를 전혀 조정하지 않고 나란히 이동합니다. 같은 전화기의 두 스크린샷은 너비를 공유하고 완벽하게 스택됩니다.
나란히 가는 대신 언제 쌓아야 합니까?
콘텐츠가 아래로 읽히거나 사진의 너비가 이미 같은 경우.
스택은 시퀀스에 적합합니다. 체크아웃 흐름의 3개의 스크린샷, After가 속하는 위치 아래의 전후, 부분적으로 캡처된 대화. 동일한 장치에서 동일한 방향으로 입력이 올 때마다 너비가 이미 일치하고 크기가 조정되지 않기 때문에 또한 옳습니다.
4032 x 11,750 이미지가 보이는 것이 아니라 스크롤되기 때문에 눈이 아래로 이동하지 않고 가로질러 움직여야 하는 비교에 나란히 있는 것이 좋습니다.
행을 선호하는 실용적인 이유도 있습니다. 하나의 이미지를 허용하는 대부분의 장소는 고정 너비로 표시하므로 매우 높은 병합이 은색으로 축소됩니다. 같은 높이의 세 장의 사진 행은 3개의 열이 결코 그렇지 않은 방식으로 해당 너비로 읽을 수 있는 상태를 유지합니다.
스트립이 그렇지 않다고 결정해야 하는 것은 무엇입니까?
셀 모양이 아닌 그림으로 할 일은 한 축만 고정하기 때문에 스트립이 절대 묻지 않아도 되는 질문입니다.
그리드 핀을 둘 다 핀다. 모든 셀은 크기가 같으며 4:3 사진은 9:19.5 스크린샷에 맞는 셀 모양에 맞지 않습니다. 정직한 답변은 두 가지뿐이며 도구는 그 중에서 선택해야 합니다.
- 담그다 셀 내부의 전체 그림을 맞추고 주변에 공간을 남깁니다. 손실된 것은 없으며 각 이미지가 자체 배경 패치에 있기 때문에 그리드가 약간 삐걱거립니다.
- 덮개 그림에서 중앙의 자르기를 가져와서 셀을 완전히 채웁니다. 그리드가 균일해 보이고 사진의 가장자리가 사라졌습니다.
둘 다 일반적으로 옳지 않습니다. 포함은 스크린샷, 문서, 다이어그램 및 가장자리에 정보를 전달하는 모든 것에 적합합니다. 덮개는 얼굴, 풍경 및 질감에 적합하며 중심 작물은 어쨌든 사람이 했을 것입니다.
여기서 기본값은 Cover입니다. 그리드를 구축하는 가장 일반적인 이유는 하나의 객체로 읽어야 하기 때문입니다.
표지가 얼마나 많은 사진을 버릴까요?
입력이 다른 모양일 때 사람들이 기대하는 것보다 더 많고 일치할 때 전혀 없습니다.
셀 크기는 입력의 평균이므로 두 개의 매우 다른 그림이 둘 다 어울리지 않는 셀을 생성합니다. 사진과 스크린샷 쌍의 경우 2셀 그리드의 레이아웃 코드는 정확히 무엇을 그려지는지 보고합니다.
| 상 | 원주민 | 소스 영역이 그려짐 | 보관된 픽셀 |
|---|---|---|---|
| 사진 | 4032 x 3024 | 2831 x 3024 | 70.2% |
| 스크린 샷 | 1170 x 2532 | 1170 x 1250 | 49.4% |
스크린샷의 절반이 사라졌습니다. 압축되지 않음, 크기 조정되지 않음: 잘린 위쪽과 아래쪽으로 잘립니다. 거의 정사각형 셀에 강제로 좁은 이미지가 있어야 끝이 잃어버리기 때문입니다. 해당 스크린샷이 영수증이라면 총계는 더 이상 사진에 없습니다.
모든 입력에 이미 셀 모양이 있기 때문에 동일한 카메라에서 12장의 사진에 동일한 작업을 수행해도 아무 것도 자르지 않습니다. 입력이 일치할 때 커버가 저렴하고 그렇지 않을 때 비용이 많이 들고 도구가 어떤 경우에 있는지 알 수 없습니다. 사진이 다른 모양이고 가장자리가 중요하는 순간을 포함하도록 전환합니다.
그리드에는 몇 개의 열이 있어야 합니까?
결과가 키보다 넓을 만큼 충분히 넓습니다. 대부분의 경우 제곱근이 반올림된 것을 의미합니다.
행은 열과 개수에서 따르며 산술은 용서하지 않습니다. 4열의 12개 이미지는 3개의 전체 행입니다. 3개의 열에 있는 7개의 이미지는 끝에 2개의 빈 셀이 있는 3개의 행이며 레이아웃은 마지막 사진을 늘리기 위해 확장하지 않고 배경으로 남깁니다.
| 이미지 | 기둥 | 결과 |
|---|---|---|
| 4 X 1000 X 1000 X 1000 X 400 X 400 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X | 2 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X 2000 X | 2 x 2, 간격 없음 |
| 6 X 1000 X 1000 X 1000 X 100 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X 60 X | 3 X 1000 X 1000 X 1000 X 100 X 100 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X | 2 x 3, 간격 없음 |
| 7 X 1000 X 1000 X 1000 X 100 X 100 X 100 X 100 X 100 X 100 X 70 X 100 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X 70 X | 3 X 1000 X 1000 X 1000 X 100 X 100 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X | 3개의 행, 2개의 셀이 비어 있음 |
| 9 X 1000 X 1000 X 1000 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 X 100 | 3 X 1000 X 1000 X 1000 X 100 X 100 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X 30 X | 3 x 3, 간격 없음 |
| 12 | 4 X 1000 X 1000 X 1000 X 400 X 400 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X 40 X | 3 x 4, 간격 없음 |
요소를 명확하게 고려하는 것은 목표로 삼을 가치가 있습니다. 7장의 사진이 있고 빈 모서리가 당신을 괴롭히는 경우, 7개의 동일한 셀의 배열이 직사각형이 아니기 때문에 정직한 수정은 하나를 떨어뜨리거나, 하나를 추가하거나 수락하는 것입니다.
왜 갭 설정이 있으며 무엇이어야 합니까?
만지는 이미지는 한 장의 그림으로 읽히고 때로는 잘못된 것입니다.
0의 간격은 파노라마에 적합합니다. 그 전후의 틈은 한 프레임처럼 보이며 솔기가 포인트인 모든 것에 대해 표시됩니다. 그런 이유로 여기에서 기본값입니다.
사진이 하나의 파일에 있는 별도의 것(3개의 제품 사진, 스크린샷 세트, 콜라주)일 때 격차가 맞습니다. 8~24픽셀의 픽셀이 수천 픽셀의 이미지에서 작업을 수행하고 슬라이더는 더 큰 작업을 위해 80으로 이동합니다. 간격은 외부와 그 사이에 적용되므로 결과는 가장자리에서 피를 흘리는 사진이 아닌 테두리가 있습니다.
Gaped Merge를 위해 PNG를 선택하기 전에 알아야 할 한 가지: 간격은 투명하게 남겨지지 않고 흰색으로 채워져 있습니다. JPEG에는 알파 채널이 없고 도색되지 않은 간격 내보내기가 검정색으로 표시되기 때문에 캔버스는 무엇이든 그려지기 전에 흰색으로 칠해져 있습니다. 따라서 이 도구의 PNG는 투명한 것보다 흰색 홈통이 있으므로 색상이 지정된 배경 위에 결과를 배치할 계획이라면 중요합니다.
병합된 이미지는 얼마나 커지나요?
입력보다 크고 누적된 경우 훨씬 더 큽니다. 아무것도 압축되지 않기 때문입니다.
캔버스 치수는 모드에서 예측할 수 있습니다. 나란히 폭은 축척된 너비의 합이고 높이는 가장 높은 입력입니다. 스택, 너비는 가장 넓은 입력이고 높이는 합계입니다. 격자는 셀의 열에 간격을 더한 열입니다.
4열 격자에 있는 12개의 전화 사진은 16,208 x 9,136픽셀(148메가픽셀)입니다. 다음 섹션이 시작되는 곳입니다.
출력이 8,000픽셀에서 멈추는 이유는 무엇입니까?
특정 크기를 초과하여 브라우저 캔버스가 작동을 멈췄고 그렇게 말하지 않습니다.
제한은 사양이 아닙니다. MDN은 그것을 분명히 표현합니다.: 대부분의 브라우저는 10,000 x 10,000 픽셀을 초과하며, iOS 기기는 역사적으로 4,096 x 4,096으로 제한되었으며 최대 치수 또는 영역을 초과하는 "캔버스를 사용할 수 없는" 영역을 초과하여 그리기 명령이 자동으로 실패합니다. 잡는 예외는 없습니다. 빈 이미지가 나오거나 전혀 없습니다. 브라우저별 수치는 캔버스 크기의 테스트 결과, 숫자를 가정하기 전에 확인할 가치가 있는 참조입니다.
따라서 레이아웃은 실패하지 않고 8,000픽셀의 긴 면에 맞게 축소됩니다. 12개의 사진 그리드의 경우 스케일 계수는 0.494로 16,208 x 9,136을 8,000 x 4,509(36메가픽셀)로 줄입니다. 각 사진은 3,024 x 4,032가 아닌 대략 1,976 x 1,483에 도달합니다.
그것은 해상도의 진정한 손실이며 정직한 거래입니다. 존재하는 3600만 화소 이미지는 브라우저가 그리기를 거부하는 148메가픽셀 이미지를 능가합니다. 12장의 사진 전체 해상도가 필요한 경우 더 적은 수의 더 큰 조각으로 병합하거나 캔버스가 없는 데스크탑 도구를 사용하십시오.
결과는 PNG 또는 JPG여야 합니까?
사진은 JPG, PNG는 PNG, 텍스트 또는 평평한 색상이 있는 모든 것을 제공합니다.
이것은 일반적인 규칙이며 병합은 그것을 변경하지 않지만 병합은 출력이 크기 때문에 더 중요합니다. 두 장의 사진을 5429 x 3024 병합하면 PNG 크기에서 알 수 있는 파일이며 JPEG 품질 0.92에서는 그렇지 않습니다. 이것이 수출하는 것입니다.
스크린샷은 반대로 유지됩니다. JPEG의 크로마 서브샘플링 및 블록 변환은 선명한 텍스트 가장자리 주위에 눈에 띄는 줄무늬를 생성하며, 병합된 스크린샷 스트립은 대부분 날카로운 텍스트 가장자리입니다. PNG는 무손실이므로 텍스트가 그대로 유지됩니다.
혼합 병합은 정답이 없습니다. 입력 중 하나가 텍스트가 있는 스크린샷이고 다른 하나가 사진인 경우 독자가 볼 사진을 선택합니다.
병합이 품질을 잃습니까?
그림은 그렇지 않지만 스케일링은 그럴 수 있으며 어느 것이 어느 것인지 알 가치가 있습니다.
기본 크기로 그려진 픽셀은 다시 압축되지 않고 복사됩니다. 같은 카메라의 두 개의 가로 사진을 나란히 병합하면 크기가 조정되지 않으므로 출력의 모든 픽셀이 입력 픽셀에서 왔습니다.
스케일링은 품질이 가는 곳입니다. 키가 큰 이웃과 일치하도록 확대된 모든 사진은 다시 샘플링되어 사진을 찍지 않은 픽셀을 발명합니다. 사진의 너비에 맞게 3.4배 확대된 스크린샷은 여기에서 설정이 수정되지 않는 방식으로 부드럽습니다. 일치하는 축에서 가장 큰 입력을 지나치는 것은 없으므로 천장이 있지만 큰 그림 옆에 있는 작은 그림이 여전히 뻗어 있습니다.
다음은 수출입니다. JPG를 선택하면 이미 JPEG에 있는 입력을 포함하여 모든 것을 다시 인코딩합니다. 이는 손실 압축의 2세대입니다. 에서 설명한 것과 동일한 메커니즘입니다. 트랙 추출에 대한 오디오 가이드, 다른 매체에서: 손실을 디코딩하고 다시 압축하는 것은 결코 공짜가 아닙니다. 품질 0.92에서 비용은 적으며 병합된 사진 스트립의 경우 어쨌든 올바른 호출입니다.
이미지는 어떤 순서로 들어가나요?
추가한 순서는 왼쪽에서 오른쪽 또는 위에서 아래로, 변경하는 유일한 방법은 하나를 제거하고 다시 추가하는 것입니다.
파일 선택기가 파일 이름별로 알파벳순으로 표시되고 때로는 그렇지 않은 순서로 파일을 제공하기 때문에 한 번에 12개의 파일을 선택하기 전에 알아야 할 가치가 있습니다. 체크아웃 흐름과 같이 중요한 시퀀스의 경우 원하는 순서로 한 번에 하나씩 추가하는 것이 나중에 수정하는 것보다 덜 작동합니다.
30개의 이미지는 천장입니다. 그것은 캔버스 제한이 아니라 온전한 한계입니다. 30개의 전화 사진을 병합하면 캡 뒤에 30메가픽셀 그리드가 있고 아무도 읽을 수 없는 레이아웃이 있습니다.
병합된 이미지가 제공하지 않는 것은 무엇입니까?
디자인 도구가 하는 모든 것, 이는 병합 도구의 정직한 경계입니다.
개별 사진 주위에는 테두리가 없고, 둥근 모서리, 그림자, 그림자, 캡션이 없으며 이미지당 회전, 겹침이 없으며 흰색 이외의 배경색이 없습니다. 각 그림은 직사각형으로 그려지며 이것이 전체 기능 집합입니다.
텍스트가 있는 프레임 콜라주를 원하면 디자인 작업이자 디자인 도구입니다. 하나의 이미지를 허용하는 것이 세 개의 이미지를 모두 얻을 수 있도록 한 파일에 세 장의 사진을 넣고 싶다면 이것이 바로 이것입니다. 두 번째를 첫 번째의 약한 버전으로 취급하는 것이 일반적인 실망의 원인입니다.
두 개의 인접한 도구는 일반적인 후속 조치를 다룹니다. 이미지에 텍스트 추가 캡션을 위해, 그리고 이미지 압축기 병합된 사진 그리드가 업로드 제한보다 크게 나올 때.
이것이 브라우저에서 실행되는 이유는 무엇입니까?
이미지는 아무데도 갈 필요가 없고, 이미지가 이동하는 순간 다른 사람의 결정이 그에게 일어나는 일입니다.
전체 병합은 캔버스 작업입니다. 파일은 페이지 메모리로 디코딩되어 탭의 캔버스에 그려지고 캔버스는 다운로드를 통해 다시 전달됩니다. toBlob. 어떤 요청도 이미지를 전달하지 않으며, 서버에 기록된 것이 없으며, 누출되거나 잊어버릴 수 있는 저장된 사본도 없습니다.
많은 병합에 대해 좋은 점입니다. 은행 거래 내역서, 문서 사진, 의료 스캔 또는 어린이 사진의 스크린샷과 관련된 것의 경우 업로드를 요청하는 첫 번째 결과 대신 이와 같은 도구를 사용하는 것이 전체 이유입니다.
비용은 위에서 설명한 캔버스 천장과 탭이 보유할 수 있는 메모리 양에 따라 매우 큰 병합이 제한된다는 사실입니다. 두 이미지 또는 12개의 이미지에 대해 어느 쪽도 충족할 수 있는 한계가 아닙니다.
