<aside>

</aside>

파워포인트로 처음 층별 색상이미지를 적용할때 임시로 층별에 색상을 넣은상태로 작업을했다.

jsp에서 이미지의 색상을 바꾸는법에는 canvas, SVG, filter값 변경등이 있었는데 나는 이미지하나당 div하나씩 줘서 작업을 했었기 때문에 filter값 변경이 용이할 것 같아서 해당방법을 사용했다

filter값은 직접찾아서 넣기에는 굉장히 복잡했는데 다행히 누군가가 이에대한 솔루션을 제작해놨었다.

해당솔루션 : https://codepen.io/sosuke/pen/Pjoqqp

원하는 색상코드를 넣으면 해당 색상과 최대한 근접한 필터값을 생성해준다

예시) 빨간색 :

filter: invert(38%) sepia(81%) saturate(1362%) hue-rotate(332deg) brightness(110%) contrast(96%);

문제

문제는 내가 이미 이미지에 색상을 지정해놨었기 때문에 같은 필터를 적용하더라도 다른색상이 화면에 출력되는것이었다

filter의 grayscale(100%)를 줘서 이미지의 색상을 빼는 방법도 사용해봤었지만 이미지의 각각 회색 농도(?) 밝기(?) 가 다르게 나왔기 때문에 색상이 다르게 나오는것은 여전했다

해결

결국엔 파워포인트 작업으로 돌아가서 모든 이미지를 검은색으로 통일하고 이미지 교체작업을 진행하여 해결하였다

앞으로 여러 이미지의 색상을 같은 기준으로 변경하기 위해서는 모든 이미지의 색상을 통일해서 사용해야 수월하다는것을 알게 되었다.