{"id":1650,"date":"2021-08-09T16:28:49","date_gmt":"2021-08-09T07:28:49","guid":{"rendered":"http:\/\/www.agile-software.site\/?p=1650"},"modified":"2021-08-09T19:14:21","modified_gmt":"2021-08-09T10:14:21","slug":"javascript%e3%82%b0%e3%83%a9%e3%83%95%e4%bd%9c%e6%88%90","status":"publish","type":"post","link":"https:\/\/agile-software.net\/?p=1650","title":{"rendered":"JavaScript[\u30b0\u30e9\u30d5\u4f5c\u6210]"},"content":{"rendered":"\n

Google Charts<\/h2>\n\n\n\n

\u68d2\u30b0\u30e9\u30d5<\/h3>\n\n\n\n

\u4e0b\u8a18\u30b3\u30fc\u30c9\u306f<\/p>\n\n\n\n

<script src="https:\/\/www.gstatic.com\/charts\/loader.js"><\/script> \n\ngoogle.charts.load("current", {"packages":["corechart"]});\ngoogle.charts.setOnLoadCallback(myChart);<\/code><\/pre><\/div>\n\n\n\n
<!DOCTYPE html>\n<html lang="ja">\n <head>\n  <meta charset="utf-8">\n  <title>\u30b0\u30e9\u30d5\u306e\u8868\u793a<\/title>\n <\/head>\n <body>\n  <h3>\u68d2\u30b0\u30e9\u30d5\u306e\u30b5\u30f3\u30d7\u30eb<\/h3>\n  <div id="mychart" style="width: 800px; height: 600px;"><\/div>\n  <script src="https:\/\/www.gstatic.com\/charts\/loader.js"><\/script>\n  <script>\n  google.charts.load("current", {"packages":["corechart"]});\n  google.charts.setOnLoadCallback(myChart);\n\n  function myChart() {\n   var data = google.visualization.arrayToDataTable([\n    ["\u52d5\u7269",      "\u4eba\u6570", { role:"style" }],\n    ["\u72ac",            11, "red"   ],\n    ["\u732b",             8, "orange"],\n    ["\u30cf\u30e0\u30b9\u30bf\u30fc",     3, "yellow"],\n    ["\u9ce5",             2, "green" ],\n    ["\u9b5a",             2, "blue"  ],\n    ["\u305d\u306e\u4ed6",         1, "pink"  ],\n    ["\u30da\u30c3\u30c8\u306f\u3044\u306a\u3044", 7, "gray"  ]\n   ]);\n\n   var options = {\n    title:"\uff13\u5e74\uff11\u7d44\u306e\u307f\u3093\u306a\u306e\u30da\u30c3\u30c8",\n   };\n\n   var chart = new google.visualization.ColumnChart(document.getElementById("mychart"));\n   chart.draw(data, options);\n  }\n  <\/script>\n <\/body>\n<\/html><\/code><\/pre><\/div>\n\n\n\n
\u5186\u30b0\u30e9\u30d5<\/h3>\n\n\n\n
<!DOCTYPE html>\n<html lang="ja">\n <head>\n  <meta charset="utf-8">\n  <title>\u30b0\u30e9\u30d5\u306e\u8868\u793a<\/title>\n <\/head>\n <body>\n  <h3>\u5186\u30b0\u30e9\u30d5\u306e\u30b5\u30f3\u30d7\u30eb<\/h3>\n  <div id="mychart" style="width:800px; height:600px;"><\/div>\n  <script src="https:\/\/www.gstatic.com\/charts\/loader.js"><\/script>\n  <script>\n  google.charts.load("current", {"packages":["corechart"]});\n  google.charts.setOnLoadCallback(myChart);\n\n  function myChart() {\n   var data = google.visualization.arrayToDataTable([\n    ["\u52d5\u7269",      "\u4eba\u6570"],\n    ["\u72ac",            11],\n    ["\u732b",             8],\n    ["\u30cf\u30e0\u30b9\u30bf\u30fc",     3],\n    ["\u9ce5",             2],\n    ["\u9b5a",             2],\n    ["\u305d\u306e\u4ed6",         1],\n    ["\u30da\u30c3\u30c8\u306f\u3044\u306a\u3044", 7]\n   ]);\n\n   var options = {\n    title:"\uff13\u5e74\uff11\u7d44\u306e\u307f\u3093\u306a\u306e\u30da\u30c3\u30c8",\n    slices: {\n     0: { color: "darkRed" },\n     1: { color: "orange" },\n     2: { color: "pink" },\n     3: { color: "lime" },\n     4: { color: "blue" },\n     5: { color: "red" },\n     6: { color: "gray" }\n    }\n   };\n\n   var chart = new google.visualization.PieChart(document.getElementById("mychart"));\n   chart.draw(data, options);\n  }\n  <\/script>\n <\/body>\n<\/html>\n<\/code><\/pre><\/div>\n\n\n\n
<\/i><\/div>
\n
Google Charts\u30db\u30fc\u30e0\u30da\u30fc\u30b8https:\/\/developers.google.com\/chart\/interactive\/docs\/reference<\/a><\/p>\n<\/div><\/div>\n","protected":false},"excerpt":{"rendered":"
Google Charts \u68d2\u30b0\u30e9\u30d5 \u4e0b\u8a18\u30b3\u30fc\u30c9\u306f \u5186\u30b0\u30e9\u30d5<\/p>\n","protected":false},"author":1,"featured_media":1655,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jin_ogp_image_url":"","_jin_last_featured_id":0,"footnotes":""},"categories":[6],"tags":[],"class_list":["post-1650","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript"],"_links":{"self":[{"href":"https:\/\/agile-software.net\/index.php?rest_route=\/wp\/v2\/posts\/1650","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/agile-software.net\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/agile-software.net\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/agile-software.net\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/agile-software.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1650"}],"version-history":[{"count":1,"href":"https:\/\/agile-software.net\/index.php?rest_route=\/wp\/v2\/posts\/1650\/revisions"}],"predecessor-version":[{"id":1651,"href":"https:\/\/agile-software.net\/index.php?rest_route=\/wp\/v2\/posts\/1650\/revisions\/1651"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/agile-software.net\/index.php?rest_route=\/wp\/v2\/media\/1655"}],"wp:attachment":[{"href":"https:\/\/agile-software.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1650"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/agile-software.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1650"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/agile-software.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1650"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}