질문/조언팁/리소스 공유

동네예보 초단기 정보에서 강우가 있을때를 제외한 나머지 하늘정보는 api에서 제공하지 않게 되어 비가 오지 않을때는 하늘 상태에 무관하게 모두 맑음을 가지게 되는(클래스가 기본값을 가져버리는 관계로) 상황은 소식으로 전해드렸고..

 

흐린 날씨에 태양 아이콘을 띄우는 것 보다는 비가오지 않는 다는 것으로 대체하는 것이 좋을 것 같다고 관련 팁을 작성해 드렸습니다

 

https://xetown.com/tips/1089948

 

 

여기에 한발 더 나아가 비가 오지 않을때 보다 중요한 미세먼지 정보를 전달하는게 좋다는 아디어가 떠올라 미세먼지 값에 따라 아이콘을 추가했습니다.

 

간단하게 통합대기에서 나쁨,매우나쁨,위험 세가지 상태일때 마스크 아이콘이 나타나도록 했습니다.

 

 

 

 

스킨 html에

 

현재날씨 아이콘을 뜨우는 곳을 찾아 <span id="ico_wl" class="ico_wl {$widget_info->data->weather->class}<!--@if(in_array($widget_info->data->aqi->level, array('나쁨','매우나쁨','위험')))--> bad_air<!--@end-->"></span>

 

이렇게 고치면 위 통합대기 상태와 일치할때 bad_air 클래스가 추가 됩니다.

 

 

css에

 

#pr_weather_html .ico_wl.DB00.bad_air, #pr_weather_html .ico_wl.DB00_N.bad_air {
     background: url(bad_air.png) no-repeat 0 0;
     background-size : 58px 58px;
}

 

이렇게 통합대기가 나쁠경우 띄울 아이콘을 새로 지정해 주면 됩니다. 물론 아이콘은 css 폴더에 업로드 해야 하구요.

 

 

 

 

이렇게해서 저희 사이트는 

 

비가 안오고 대기 상태가 좋을때는...

 

outdoor.png

요렇게 외출을 해도 된다는 아이콘을 표시합니다. 사이트 성격에 맞게 반려견과 외출을 하는 아이콘입니다.

 

 

 

 

 

비가 오지 않고 대기상태가 나쁜 경우

 

bad_air.png

 

 

물론 비가오거나 하면 기상청에서 하늘 상태값을 제공하기 때문에 강우 아이콘이 표시되구요~

 

 

 

요렇게 마스크를 써야 한다는 표시의 아이콘이 표시됩니다.

 

 

날씨위젯 자료 

https://xetown.com/tips/874593

글쓴이 웹지기

profile
^ ^
Atachment
첨부 2
  • profile
    우와! 미세먼지까지 추가시키시다니..대단합니다!
  • profile profile
    미세먼지 정보는 원래 나옵니다. 굳이 아이콘으로 표시 안해줘도 되지만..
    초단기 날씨 정보 중 하늘상태값을 기상청에서 10월부터 강우가 있을때만 즉 비가 올때만 제공하고 그렇지 않은 세부 흐림,구름많음,안개 등 이런 정보는 제공하지 않아 늘 맑은상태 태양 아이콘을 띄우거나 혹은 아이콘을 비가 올때만 제공해야 하는 상황으로 바뀌게 된 것 입니다.

    기상청 홈페이지에서는 현재날씨에 비가 오지 않으면 아이콘이 사라집니다.

    그런데 공개된 날씨 위젯에서 저는 비가 오지 않는 경우도 외출 가능하다는 상징의 아이콘,그리고 이번에 통합대기가 나쁘면 그보다 더 중요한 마스크아이콘으로 대체하고 비가오면 그대로 강우 아이콘이 나오도록 한거죠.
  • profile profile
    이 if 구문을 사용하신거군요?<!--@if(in_array($widget_info->data->aqi->level, array('나쁨','매우나쁨','위험')))-->
  • profile profile
    사실 전 개발자는 아니지만 if 구분만 조금 활용하고 필요한 변수등만 찾아보고 해서 필요한 것을 많이 구현합니다. 운영자가 소소하게 커스터마이징 할때 if 구문만 조금 익혀두면 많은 도움이 된다고 생각합니다.

서버에 요청 중입니다. 잠시만 기다려 주십시오...