{"id":4645,"date":"2015-12-08T10:20:55","date_gmt":"2015-12-08T01:20:55","guid":{"rendered":"https:\/\/gunmagisgeek.com\/wordpress\/?p=4645"},"modified":"2015-12-08T10:54:35","modified_gmt":"2015-12-08T01:54:35","slug":"post-4645","status":"publish","type":"post","link":"https:\/\/gunmagisgeek.com\/blog\/d3-js\/4645","title":{"rendered":"\u3010D3.js\u3011MapboxGL\u306e\u5730\u56f3\u4e0a\u306bSVG\u3092\u30aa\u30fc\u30d0\u30fc\u30ec\u30a4\u3059\u308b\u3002"},"content":{"rendered":"<p>Mapbox\u304c\u30d0\u30fc\u30b8\u30e7\u30f3\u30a2\u30c3\u30d7\u3055\u308c\u3001MapboxGL.js\u30e9\u30a4\u30d6\u30e9\u30ea\u304c\u516c\u5f0f\u306e\u30af\u30e9\u30a4\u30a2\u30f3\u30c8\u30e9\u30a4\u30d6\u30e9\u30ea\u3068\u306a\u3063\u305f\u3088\u3046\u3067\u3059\u3002\u4ee5\u524d\u306eMapbox.js\u306fLeaflet.js\u30d9\u30fc\u30b9\u3067D3\u3068\u7d44\u307f\u5408\u308f\u305b\u3084\u3059\u304f\u3066\u6c17\u306b\u5165\u3063\u3066\u3044\u305f\u306e\u3067\u3059\u304c\u3001\u3068\u308a\u3042\u3048\u305aMapboxGL\u3067\u4f5c\u6210\u3057\u305f\u5730\u56f3\u306e\u4e0a\u306bD3.js\u3092\u4f7f\u3063\u3066SVG\u3092\u30aa\u30fc\u30d0\u30fc\u30ec\u30a4\u3059\u308b\u30b5\u30f3\u30d7\u30eb\u3092\u4f5c\u3063\u3066\u307f\u307e\u3057\u305f\u3002<\/p>\n<p><a href=\"http:\/\/bl.ocks.org\/shimizu\/2befed84f04393a47d45\"><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/gunmagisgeek.com\/blog\/wp-content\/uploads\/2015\/12\/mapboxAndD3_1.png\" alt=\"mapboxGL &amp; D3.js \u30dd\u30a4\u30f3\u30c8\u30b5\u30f3\u30d7\u30eb\" width=\"590\" height=\"309\" class=\"aligncenter size-full wp-image-4643\" srcset=\"https:\/\/gunmagisgeek.com\/blog\/wp-content\/uploads\/2015\/12\/mapboxAndD3_1.png 590w, https:\/\/gunmagisgeek.com\/blog\/wp-content\/uploads\/2015\/12\/mapboxAndD3_1-286x150.png 286w\" sizes=\"auto, (max-width: 590px) 100vw, 590px\" \/><\/a><\/p>\n<p><a href=\"http:\/\/bl.ocks.org\/shimizu\/2befed84f04393a47d45\">example<\/a><\/p>\n<p><a href=\"http:\/\/bl.ocks.org\/shimizu\/5f4cee0fddc7a64b55a9\"><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/gunmagisgeek.com\/blog\/wp-content\/uploads\/2015\/12\/mapboxAndD3_2.png\" alt=\"MapboxGL &amp; D3 \u30dd\u30ea\u30b4\u30f3\u30b5\u30f3\u30d7\u30eb\" width=\"590\" height=\"307\" class=\"aligncenter size-full wp-image-4644\" srcset=\"https:\/\/gunmagisgeek.com\/blog\/wp-content\/uploads\/2015\/12\/mapboxAndD3_2.png 590w, https:\/\/gunmagisgeek.com\/blog\/wp-content\/uploads\/2015\/12\/mapboxAndD3_2-288x150.png 288w\" sizes=\"auto, (max-width: 590px) 100vw, 590px\" \/><\/a><\/p>\n<p><a href=\"http:\/\/bl.ocks.org\/shimizu\/5f4cee0fddc7a64b55a9\">example<\/a><\/p>\n<p>\u4e21\u65b9\u3068\u3082bl.ocks\u306b\u516c\u958b\u3057\u3066\u3044\u308b\u306e\u3067\u30b5\u30f3\u30d7\u30eb\u30b3\u30fc\u30c9\u3092\u307f\u305f\u3044\u304b\u305f\u306f\u305d\u3061\u3089\u3092\u3002<\/p>\n<p>\u30dd\u30a4\u30f3\u30c8\u3068\u306a\u3063\u3066\u3044\u308b\u306e\u306f\u3001\u7def\u5ea6\u7d4c\u5ea6\u3092\u5730\u56f3\u4e0a\u306e\u5ea7\u6a19\u306b\u5909\u63db\u3057\u3066\u3044\u308b\u90e8\u5206\u3067\u3001leaflet.js\u4e0a\u306bsvg\u3092\u30aa\u30fc\u30d0\u30fc\u30ec\u30a4\u3059\u308b\u306e\u3068\u57fa\u672c\u304b\u308f\u308a\u307e\u305b\u3093\u3002<\/p>\n<pre class=\"lang:js decode:true \" >function projectPoint(lon, lat) {\r\n    var point = map.project(new mapboxgl.LngLat(lon, lat));\r\n    this.stream.point(point.x, point.y);\r\n}\r\n<\/pre>\n<p>\u4f7f\u3046\u3068\u304d\u306f\u3053\u3093\u306a\u611f\u3058\u3002<\/p>\n<pre class=\"lang:js decode:true \" >var transform = d3.geo.transform({point: projectPoint});\r\nvar path = d3.geo.path().projection(transform);\r\n<\/pre>\n<p>\u3069\u3093\u306a\u5730\u56f3\u30af\u30e9\u30a4\u30a2\u30f3\u30c8\u30e9\u30a4\u30d6\u30e9\u30ea\u3067\u3082\u3001\u3053\u306e\u3088\u3046\u306a\u5ea7\u6a19\u5909\u63db\u304c\u884c\u3048\u308b\u30e1\u30bd\u30c3\u30c9\u304c\u7528\u610f\u3055\u308c\u3066\u3044\u308c\u3070\u3001D3.js\u3067\u4f5c\u6210\u3057\u305fSVG\u3092\u30aa\u30fc\u30d0\u30fc\u30ec\u30a4\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Mapbox\u304c\u30d0\u30fc\u30b8\u30e7\u30f3\u30a2\u30c3\u30d7\u3055\u308c\u3001MapboxG&hellip;<\/p>\n","protected":false},"author":1,"featured_media":4644,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18,64],"tags":[],"class_list":["post-4645","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-d3-js","category-mapboxgl","has-post-thumbnail-archive"],"_links":{"self":[{"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/posts\/4645","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/comments?post=4645"}],"version-history":[{"count":0,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/posts\/4645\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/media\/4644"}],"wp:attachment":[{"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/media?parent=4645"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/categories?post=4645"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/tags?post=4645"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}