๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ

๋ฐ”๋‹๋ผJS์ฑŒ๋ฆฐ์ง€2

[TIL] ๐Ÿ’ก Day 11 - JS๋กœ ์‚ฌ์šฉ์ž์˜ ์œ„์น˜ ์ •๋ณด์™€ ํ•ด๋‹น ์œ„์น˜์˜ ๋‚ ์”จ ํ‘œ์‹œํ•˜๊ธฐ โœ” ์ด ํฌ์ŠคํŒ…์€ ๋…ธ๋งˆ๋“œ์ฝ”๋” - "๋ฐ”๋‹๋ผ JS๋กœ ํฌ๋กฌ ์•ฑ ๋งŒ๋“ค๊ธฐ๋ฅผ ๋“ค์œผ๋ฉด์„œ ๊นƒํ—ˆ๋ธŒ์— ๊ธฐ๋กํ•œ ํ•„๊ธฐ๋ฅผ ์˜ฎ๊ธด ๋‚ด์šฉ์ž…๋‹ˆ๋‹ค. ๋ชฉํ‘œ : ๐ŸŒŽ์‚ฌ์šฉ์ž์˜ ์œ„์น˜ ์ •๋ณด์™€ โ›…ํ•ด๋‹น ์œ„์น˜์˜ ๋‚ ์”จ ํ‘œ์‹œํ•˜๊ธฐ ๐ŸŒฑ User์˜ ์œ„๋„(latitude) , ๊ฒฝ๋„(longitude) ๊ตฌํ•˜๊ธฐ ๐Ÿ‘‰ navigator ํ•จ์ˆ˜๋ฅผ ์ด์šฉํ•ด ์‚ฌ์šฉ์ž์˜ ์œ„์น˜๋ฅผ ์•Œ์•„๋‚ด๋Š” ์ฝ”๋“œ ์ž‘์„ฑ mdn ๋งํฌ JavaScript๊ฐ€ position์„ ํ†ตํ•ด์„œ user์˜ ์œ„์น˜๋ฅผ ์ „๋‹ฌํ•ด์คŒ. position์€ object์ด๊ณ , ์œ„๋„, ๊ฒฝ๋„ ๊ฐ’์ด ํฌํ•จ๋˜์–ด ์žˆ๋‹ค. position( )ํ•จ์ˆ˜๋Š” 2๊ฐœ์˜ ์ธ์ž๊ฐ€ ํ•„์š”ํ•˜๋‹ค. ์ •์ƒ์ ์œผ๋กœ ์‹คํ–‰๋์„ ๋•Œ์˜ ํ•จ์ˆ˜ (onGeoOk) ์‹คํ–‰ ์‹คํŒจํ–ˆ์„ ๋•Œ์˜ ํ•จ์ˆ˜ (onGeoError) navigator.geolocation.getCurrentPosition(์‹คํ–‰โญ•ํ•จ์ˆ˜, .. 2022. 5. 2.
[ํ›„๊ธฐ] ๋…ธ๋งˆ๋“œ์ฝ”๋” ๋ฐ”๋‹๋ผJS ์ฑŒ๋ฆฐ์ง€ 1์ฃผ์ผ ์ง€๋‚œ ์‹œ์  ํ›„๊ธฐ ๋ฐ”๋‹๋ผ JS์ฑŒ๋ฆฐ์ง€๋ž€? ๐Ÿ‘‰ "๋…ธ๋งˆ๋“œ์ฝ”๋”" ์‚ฌ์ดํŠธ์—์„œ ์ง„ํ–‰ ์ค‘์ธ ํ”„๋กœ๊ทธ๋žจ์œผ๋กœ, ๋งค ๊ธฐ๊ฐ„๋ณ„๋กœ ์ง€์›์ž๋ฅผ ๋ฐ›์•„์„œ ์ •ํ•ด์ง„ ๊ธฐ๊ฐ„ ๋™์•ˆ ๋ฏธ์…˜์— ๋„์ „ํ•˜๋Š” ์ผ์ข…์˜ ์Šคํ„ฐ๋””๋‹ค! ๊ทธ๋ฆฌ๊ณ  ์ฑŒ๋ฆฐ์ง€๋Š” ๋ฌด๋ฃŒ์ง€๋งŒ, ์ฑŒ๋ฆฐ์ง€์— ์ฐธ์—ฌํ•˜๊ธฐ ์œ„ํ•ด ์œ ๋ฃŒ ๊ฐ•์˜๋ฅผ ์ˆ˜๊ฐ•ํ•ด์•ผ ํ•˜๋Š” ๊ฒฝ์šฐ๊ฐ€ ์žˆ๋Š” ๊ฒƒ ๊ฐ™๋‹ค. ๊ทธ์ค‘์—์„œ ๋‚ด๊ฐ€ ์ฐธ์—ฌํ•œ ๊ณผ์ •์€ ๋ฐ”๋‹๋ผJS์ฑŒ๋ฆฐ์ง€๋กœ ์•„๋ž˜์˜ '๋ฐ”๋‹๋ผ JS๋กœ ํฌ๋กฌ ์•ฑ ๋งŒ๋“ค๊ธฐ' ๊ฐ•์˜์™€ ๊ฐ™์ด ์ง„ํ–‰๋˜๋Š” ์ฑŒ๋ฆฐ์ง€์ด๋‹ค. ๊ฐ•์˜๋„ ๋ฌด๋ฃŒ, ์ฑŒ๋ฆฐ์ง€๋„ ๋ฌด๋ฃŒ์ธ๋ฐ ์ฑŒ๋ฆฐ์ง€๋ฅผ ๋๋‚ด๊ณ  ๋‚˜๋ฉด ๋‹ค๋ฅธ ๊ฐ•์˜๋ฅผ ๋“ค์„ ๋•Œ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ์ตœ๋Œ€ 30% ํ• ์ธ์ฟ ํฐ๊ณผ ๋ฑƒ์ง€, ์ˆ˜๋ฃŒ์ฆ ๋“ฑ์„ ์ œ๊ณตํ•œ๋‹ค๊ณ  ํ•˜๋‹ˆ ์•ˆ ํ•  ์ด์œ ๊ฐ€ ์žˆ๋‚˜?๐Ÿ˜† ์ฑŒ๋ฆฐ์ง€์˜ ๋ชฉ์ ? ํ™ˆํŽ˜์ด์ง€์— ๋‚˜์™€์žˆ๋Š” ๋ชฉ์ ์€ ์œ„์™€ ๊ฐ™๋‹ค. ํฌ๊ฒŒ ๊ฐ•์˜๋ฅผ ๋Š์–ด๋†“๊ณ  ์™„๊ฐ•ํ•˜๊ธฐ ํž˜๋“ค์—ˆ๋˜ ์‚ฌ๋žŒ์ด๋‚˜, ๊ฐ•์˜๋งŒ ๋“ฃ๊ณ  ์‹ค์ „์— ์ ์šฉ์ด ์–ด๋ ค์› ๋˜ ์‚ฌ๋žŒ๋“ค์ด ๋“ค์œผ๋ฉด ์ข‹๋‹ค.. 2022. 3. 16.
๋ฐ˜์‘ํ˜•