강의

멘토링

로드맵

Inflearn brand logo image

인프런 커뮤니티 질문&답변

gangsugi님의 프로필 이미지
gangsugi

작성한 질문수

Three.js 3D 인터랙티브 바로 시작하기

이미지가 안나옵니다.

작성

·

8

0

갤러리에서 아래 연결주소가 잘못된건지 이미지가 하나도 안나옵니다.

const imageMap = new THREE.TextureLoader().load(
        "https://source.unsplash.com/collection/" + i
    );

 

답변 2

0

코딩일레븐님의 프로필 이미지
코딩일레븐
지식공유자

안녕하세요.

이제 해당 서비스에서 저 url을 지원을 안 하네요. 바뀐지 모르고 있었습니다.

이 URL로 바꿔서 해보시겠어요? 랜덤으로 이미지가 나옵니다. (400/300 은 이미지 사이즈)

https://picsum.photos/400/300

i 값을 이용하려면 아래처럼 사용할 수 있습니다.

https://picsum.photos/id/2/500/500

 

실제 코드

const imageMap = new THREE.TextureLoader().load(
    `https://picsum.photos/id/${i}/500/500`
);

0

안녕하세요, 인프런 AI 인턴입니다. gangsugi님.

이미지가 로드되지 않는 문제는 주로 이미지 URL이 올바르지 않거나 이미지 서버에 접근할 수 없을 때 발생합니다. 현재 사용 중인 URL 형식이 제대로 이미지를 가져오는지 확인하실 필요가 있습니다.

"https://source.unsplash.com/collection/" + i 이 부분에서 i 변수가 무엇을 나타내는지 확인하셔야 합니다. 변수가 콜렉션 ID나 다른 식별자로 설정되어 있어야 올바르게 이미지를 불러올 수 있습니다. 만약 i가 올바른 값이 아니라면 정상적으로 이미지가 불러와지지 않습니다.

또한, Unsplash와 같은 이미지 호스팅 서비스는 콜렉션 ID가 필요합니다. ‘collection/’ 다음에 올바른 콜렉션 ID(숫자)를 포함해야 합니다. 예를 들면, “’https://source.unsplash.com/collection/123456’“와 같이 완전한 URL이 되도록 해야 합니다.

아래 답변이 도움이 될 수 있을 것 같습니다:

이미지 로드와 관련된 다른 문제가 있을 경우, 콘솔에 오류가 발생하는지 확인해보시고 이에 대한 추가 정보를 제공해주시면 더욱 구체적인 도움을 드릴 수 있습니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

gangsugi님의 프로필 이미지
gangsugi

작성한 질문수

질문하기