{"id":40091,"date":"2024-11-03T04:11:24","date_gmt":"2024-11-03T04:11:24","guid":{"rendered":"https:\/\/atmokpo.com\/w\/?p=40091"},"modified":"2024-11-26T06:40:07","modified_gmt":"2024-11-26T06:40:07","slug":"64-%eb%8d%b0%ec%9d%b4%ed%84%b0-%ec%8b%9c%ea%b0%81%ed%99%94-%eb%b0%8f-%eb%b3%b4%ea%b3%a0%ec%84%9c-%ec%8b%a4%ec%8b%9c%ea%b0%84-%eb%8d%b0%ec%9d%b4%ed%84%b0-%ec%97%85%eb%8d%b0%ec%9d%b4%ed%8a%b8%ec%99%80","status":"publish","type":"post","link":"https:\/\/atmokpo.com\/w\/40091\/","title":{"rendered":"64. \ub370\uc774\ud130 \uc2dc\uac01\ud654 \ubc0f \ubcf4\uace0\uc11c, \uc2e4\uc2dc\uac04 \ub370\uc774\ud130 \uc5c5\ub370\uc774\ud2b8\uc640 \uc2dc\uac01\ud654 \uad6c\ud604"},"content":{"rendered":"

<\/p>\n

\n \ub370\uc774\ud130 \uc2dc\uac01\ud654\ub294 \ub370\uc774\ud130\ub97c \ud6a8\uacfc\uc801\uc73c\ub85c \uc804\ub2ec\ud558\ub294 \uc911\uc694\ud55c \ub3c4\uad6c\uc785\ub2c8\ub2e4. \ube14\ub85c\uadf8\ub098 \uc6f9\uc0ac\uc774\ud2b8\uc5d0\uc11c \uc0ac\uc6a9\uc790\uc640\uc758 \uc0c1\ud638\uc791\uc6a9\uc744 \uadf9\ub300\ud654\ud558\uae30 \uc704\ud574
\n \ub370\uc774\ud130\uc758 \uc2dc\uac01\uc801 \ud45c\ud604\uc744 \uc0ac\uc6a9\ud558\ub294 \uac83\uc774 \ud544\uc218\uc801\uc785\ub2c8\ub2e4. \uc774 \ud29c\ud1a0\ub9ac\uc5bc\uc5d0\uc11c\ub294 \uc6cc\ub4dc\ud504\ub808\uc2a4\uc5d0\uc11c \ub370\uc774\ud130 \uc2dc\uac01\ud654 \ubc0f \ubcf4\uace0\uc11c\ub97c \uad6c\ud604\ud558\ub294 \ubc29\ubc95\uc744
\n \ub2e8\uacc4\ubcc4\ub85c \uc124\uba85\ud569\ub2c8\ub2e4. \ub610\ud55c \uc2e4\uc2dc\uac04 \ub370\uc774\ud130 \uc5c5\ub370\uc774\ud2b8\uc640 \uc2dc\uac01\ud654\uc758 \ud1b5\ud569\uc5d0 \ub300\ud574\uc11c\ub3c4 \ub2e4\ub8f0 \uac83\uc785\ub2c8\ub2e4.\n <\/p>\n

1. \ub370\uc774\ud130 \uc2dc\uac01\ud654\uc758 \uc911\uc694\uc131<\/h2>\n
\n \ub370\uc774\ud130\ub97c \uc2dc\uac01\ud654\ud558\uba74 \ubcf5\uc7a1\ud55c \ub370\uc774\ud130 \uc9d1\ud569\uc744 \uc774\ud574\ud558\uae30 \uc27d\uac8c \ubcc0\ud658\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4. \uadf8\ub798\ud504, \ucc28\ud2b8 \ub610\ub294 \ub9f5 \ub4f1\uc744 \uc0ac\uc6a9\ud558\uc5ec
\n \uc815\ubcf4\ub97c \uc9c1\uad00\uc801\uc73c\ub85c \ud45c\ud604\ud560 \uc218 \uc788\uc73c\uba70, \uc774\ub294 \uc0ac\uc6a9\uc790\uc5d0\uac8c \uc911\uc694\ud55c \uc778\uc0ac\uc774\ud2b8\ub97c \uc81c\uacf5\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.
\n \uc608\ub97c \ub4e4\uc5b4, \ub9e4\ucd9c \ub370\uc774\ud130, \ubc29\ubb38\uc790 \ud2b8\ub80c\ub4dc, \uc0ac\uc6a9\uc790 \ud589\ub3d9 \ub4f1\uc744 \uc2dc\uac01\uc801\uc73c\ub85c \ubcf4\uc5ec\uc904 \ub54c \uc720\uc800\ub4e4\uc740 \ud328\ud134\uc744 \uc27d\uac8c \uc778\uc9c0\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.\n <\/p>\n

2. \ud544\uc694\ud55c \ub3c4\uad6c \ubc0f \ub77c\uc774\ube0c\ub7ec\ub9ac<\/h2>\n

\n \ub370\uc774\ud130 \uc2dc\uac01\ud654\ub97c \uc704\ud574\uc11c\ub294 \uba87 \uac00\uc9c0 \ub3c4\uad6c\uc640 \ub77c\uc774\ube0c\ub7ec\ub9ac\uac00 \ud544\uc694\ud569\ub2c8\ub2e4. \uc774\ub97c \ud1b5\ud574 \uc2dc\uac01\ud654 \uc791\uc5c5\uc744 \uc27d\uac8c \uc218\ud589\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.\n <\/p>\n

Chart.js:<\/strong> \uc9c1\uad00\uc801\uc778 API\ub97c \uc81c\uacf5\ud558\uba70 \ub2e4\uc591\ud55c \ucc28\ud2b8\ub97c \uc27d\uac8c \uc0dd\uc131\ud560 \uc218 \uc788\ub294 \uc790\ubc14\uc2a4\ud06c\ub9bd\ud2b8 \ub77c\uc774\ube0c\ub7ec\ub9ac\uc785\ub2c8\ub2e4.<\/li>\n
Google Charts:<\/strong> \uad6c\uae00\uc758 API\ub97c \uae30\ubc18\uc73c\ub85c \ud558\uc5ec \uac15\ub825\ud55c \ub370\uc774\ud130 \uc2dc\uac01\ud654\ub97c \uc81c\uacf5\ud558\ub294 \ud234\uc785\ub2c8\ub2e4.<\/li>\n

D3.js:<\/strong> \ub370\uc774\ud130\ub97c \uae30\ubc18\uc73c\ub85c \ud55c \ub3d9\uc801\uc778 \uc2dc\uac01\ud654\ub97c \ub9cc\ub4e4 \uc218 \uc788\ub294 \uc790\ubc14\uc2a4\ud06c\ub9bd\ud2b8 \ub77c\uc774\ube0c\ub7ec\ub9ac\uc785\ub2c8\ub2e4.<\/li>\n<\/ul>\n
2.1 Chart.js \uc124\uce58\ud558\uae30<\/h3>\n
\n \uc6cc\ub4dc\ud504\ub808\uc2a4\uc5d0\uc11c Chart.js\ub97c \uc0ac\uc6a9\ud558\uae30 \uc704\ud574\uc11c\ub294 \uba3c\uc800 \ud50c\ub7ec\uadf8\uc778 \ub610\ub294 \ud14c\ub9c8\uc5d0 Chart.js \ub77c\uc774\ube0c\ub7ec\ub9ac\ub97c \ucd94\uac00\ud574\uc57c \ud569\ub2c8\ub2e4.
\n \ub2e4\uc74c \ucf54\ub4dc\ub97c \ud14c\ub9c8\uc758 `functions.php` \ud30c\uc77c\uc5d0 \ucd94\uac00\ud558\uc5ec \ub77c\uc774\ube0c\ub7ec\ub9ac\ub97c \ub85c\ub4dc\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.\n <\/p>\n
\nfunction enqueue_chartjs() {\n wp_enqueue_script('chart-js', 'https:\/\/cdn.jsdelivr.net\/npm\/chart.js', array(), null, true);\n}\nadd_action('wp_enqueue_scripts', 'enqueue_chartjs');\n <\/code><\/pre>\n3. \ub370\uc774\ud130 \uc2dc\uac01\ud654 \uad6c\ud604\ud558\uae30<\/h2>\n\n \uc774\ubc88 \uc139\uc158\uc5d0\uc11c\ub294 \uac04\ub2e8\ud55c \ub370\uc774\ud130 \uc2dc\uac01\ud654 \uc608\uc81c\ub97c \ud1b5\ud574 Chart.js\ub97c \uc0ac\uc6a9\ud558\uc5ec \ub370\uc774\ud130\ub97c \uc2dc\uac01\ud654\ud558\ub294 \ubc29\ubc95\uc744 \uc124\uba85\ud569\ub2c8\ub2e4.\n <\/p>\n 3.1 HTML \ub9c8\ud06c\uc5c5 \uc0dd\uc131\ud558\uae30<\/h3>\n\n \ub2e4\uc74c\uc740 \uae30\ubcf8\uc801\uc778 HTML \uad6c\uc870\ub85c, \ucc28\ud2b8\ub97c \ud45c\uc2dc\ud560 ` \n\n \ub370\uc774\ud130 \uc2dc\uac01\ud654 \uc608\uc81c<\/h2>\n

3.1 HTML \ub9c8\ud06c\uc5c5 \uc0dd\uc131\ud558\uae30<\/h3>\n
\n \ub2e4\uc74c\uc740 \uae30\ubcf8\uc801\uc778 HTML \uad6c\uc870\ub85c, \ucc28\ud2b8\ub97c \ud45c\uc2dc\ud560 `
`\n\n \ub370\uc774\ud130 \uc2dc\uac01\ud654 \uc608\uc81c<\/h2>\n`

\ub370\uc774\ud130 \uc2dc\uac01\ud654 \uc608\uc81c<\/h2>\n

3.2 \ucc28\ud2b8 \uadf8\ub9ac\uae30<\/h3>\n
\n \uc774\uc81c JavaScript \ucf54\ub4dc\ub97c \uc791\uc131\ud558\uc5ec \ucc28\ud2b8\ub97c \uadf8\ub824\ubcf4\uaca0\uc2b5\ub2c8\ub2e4. \ub2e4\uc74c \ucf54\ub4dc\ub97c `