Merge pull request #24 from Soongsil-University-MakeUs-Challenge/feat…

…ure/map-logic feature/map-logic
Soongsil-University-MakeUs-Challenge · Sep 26, 2022 · 32c3191 · 32c3191
2 parents 324def2 + 60ef18b
commit 32c3191
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 9 deletions.
diff --git a/pages/_document.jsx b/pages/_document.jsx
@@ -24,7 +24,7 @@ export default class MyDocument extends Document {
     return (
         <Html lang="ko">
           <Head />
-          <script type="text/javascript" src={`//dapi.kakao.com/v2/maps/sdk.js?appkey=1664a34e52ea5802af4d289cbdeef3ed&libraries=services`}/>
+          <script type="text/javascript" src={`//dapi.kakao.com/v2/maps/sdk.js?appkey=1664a34e52ea5802af4d289cbdeef3ed&libraries=services`} async/>
           <body>
           <Main />
           <NextScript />

diff --git a/pages/map/_components/KakaoAPIMap.jsx b/pages/map/_components/KakaoAPIMap.jsx
@@ -14,7 +14,7 @@ const dustMapper = {
 };
 
 
-export const KakaoAPIMap = ({dusts}) => { //{dusts}
+export const KakaoAPIMap = ({dusts}) => {
   const [myLocation, setMyLocation] = useState("");
 
 
@@ -43,7 +43,7 @@ export const KakaoAPIMap = ({dusts}) => { //{dusts}
       center={{ lat: 37.496313, lng: 126.957037 }}
       style={{ width: "100%", height: "100vh" }}
     >
-      {dusts.map((dust) => {
+      {dusts && dusts.map((dust) => {
         return (
           !dust.caught&&(
           <CustomOverlayMap

diff --git a/pages/map/index.js b/pages/map/index.js
@@ -37,21 +37,21 @@ export default function Map() {
             <div className={styles.stardust_container}>
             {dusts.map((dust) => {
             if(dust.dustId==1) {
-                return (<div className={dust.caught ? styles.catched_stardust_black : styles.stardust_black} />)
+                return (<div key={dust.dustId} className={dust.caught ? styles.catched_stardust_black : styles.stardust_black} />)
             }
             else if(dust.dustId==2) {
-                return (<div className={dust.caught ? styles.catched_stardust_white : styles.stardust_white } /> );
+                return (<div key={dust.dustId} className={dust.caught ? styles.catched_stardust_white : styles.stardust_white } /> );
             }
             else if(dust.dustId==3)
             {
-                return (<div className={dust.caught ? styles.catched_stardust_green : styles.stardust_green } /> );
+                return (<div key={dust.dustId} className={dust.caught ? styles.catched_stardust_green : styles.stardust_green } /> );
             }
             else if(dust.dustId==4){
-                return (<div className={dust.caught ? styles.catched_stardust_yellow : styles.stardust_yellow } /> );
+                return (<div key={dust.dustId} className={dust.caught ? styles.catched_stardust_yellow : styles.stardust_yellow } /> );
             }
             else {
-                console.log(5);
-                return (<div className={dust.caught ? styles.catched_stardust_purple : styles.stardust_purple } /> );
+
+                return (<div key={dust.dustId} className={dust.caught ? styles.catched_stardust_purple : styles.stardust_purple } /> );
             }
             })};
             </div>