{"id":666472,"date":"2019-11-26T09:05:35","date_gmt":"2019-11-26T17:05:35","guid":{"rendered":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&#038;p=666472"},"modified":"2020-01-29T01:38:03","modified_gmt":"2020-01-29T09:38:03","slug":"clicking-in-a-3d-web-scene-can-do-that","status":"publish","type":"blog","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that","title":{"rendered":"Clicking in a 3D web scene can do that?"},"author":7011,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","meta":{"_acf_changed":false,"_searchwp_excluded":""},"categories":[23771],"tags":[549072,514502,368782,29401],"industry":[],"product":[36831],"class_list":["post-666472","blog","type-blog","status-publish","format-standard","hentry","category-3d-gis","tag-esrirdzurich","tag-hittest","tag-interactive","tag-web","product-js-api-arcgis"],"acf":{"short_description":"A blog post about interactivity in a 3D web scene with ArcGIS API for JavaScript's hitTest","flexible_content":[{"acf_fc_layout":"content","content":"<p class=\"graf graf--p\">This blog post shows you how to make use of <a class=\"markup--anchor markup--p-anchor\" href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html\" target=\"_blank\" rel=\"noopener\" data-href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html\">SceneView.hitTest()<\/a> when you need to retrieve the objects that the user clicked on in a web scene. Starting with <a href=\"https:\/\/developers.arcgis.com\/javascript\/\">ArcGIS API for JavaScript<\/a> version 4.12 you can:<\/p>\n<ul>\n<li>select which layers should be intersected by passing <code class=\"markup--code markup--li-code\">include<\/code> or <code class=\"markup--code markup--li-code\">exclude<\/code> parameters to the <code class=\"markup--code markup--li-code\">hitTest()<\/code> method<\/li>\n<li>retrieve all 3D objects that are intersected along with the distance to each object in <code class=\"markup--code markup--li-code\"><a class=\"markup--anchor markup--li-anchor\" href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html#HitTestResult\" target=\"_blank\" rel=\"noopener\" data-href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html#HitTestResult\">HitTestResult.results<\/a><\/code><\/li>\n<li>get the intersection point with the ground along with the distance to that point in <code class=\"markup--code markup--li-code\"><a class=\"markup--anchor markup--li-anchor\" href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html#HitTestResult\" target=\"_blank\" rel=\"noopener\" data-href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html#HitTestResult\">HitTestResult.ground<\/a><\/code><\/li>\n<\/ul>\n<p class=\"graf graf--p\">In this blog post we\u2019ll look into using this new functionality and to make it more fun, we\u2019ll use it to build <a class=\"markup--anchor markup--p-anchor\" href=\"https:\/\/ralucanicola.github.io\/JSAPI_demos\/greenify-city\/\" target=\"_blank\" rel=\"noopener\" data-href=\"https:\/\/ralucanicola.github.io\/JSAPI_demos\/greenify-city\/\">a playful app<\/a> that plants trees on buildings, just by moving the cursor over them:<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":666612,"id":666612,"title":"trees-2","filename":"trees-2.gif","filesize":818205,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/trees-2.gif","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\/trees-2","alt":"","author":"7011","description":"","caption":"The purple trees are the trees planted on streets. They currently exist in Manhattan. The green ones are planted by the user.","name":"trees-2","status":"inherit","uploaded_to":666472,"date":"2019-11-26 14:48:49","modified":"2019-11-26 14:49:36","menu_order":0,"mime_type":"image\/gif","type":"image","subtype":"gif","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":400,"height":308,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/trees-2-213x200.gif","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/trees-2.gif","medium-width":339,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/trees-2.gif","medium_large-width":400,"medium_large-height":308,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/trees-2.gif","large-width":400,"large-height":308,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/trees-2.gif","1536x1536-width":400,"1536x1536-height":308,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/trees-2.gif","2048x2048-width":400,"2048x2048-height":308,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/trees-2.gif","card_image-width":400,"card_image-height":308,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/trees-2.gif","wide_image-width":400,"wide_image-height":308}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/ralucanicola.github.io\/JSAPI_demos\/greenify-city\/"},{"acf_fc_layout":"content","content":"<p class=\"graf graf--p\">Afterwards we\u2019ll also look at the documentation sample and tweak it to create a small tool that visualizes a line of sight from the camera viewpoint.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":666502,"id":666502,"title":"line-of-sight","filename":"line-of-sight.png","filesize":130804,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/line-of-sight.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\/line-of-sight","alt":"","author":"7011","description":"","caption":"A line of sight analysis shows the intersections between two points: an observer and a target. In this case the observer is the camera and the target is set by the user anywhere in the scene.","name":"line-of-sight","status":"inherit","uploaded_to":666472,"date":"2019-11-26 10:51:45","modified":"2019-11-26 15:01:03","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":1000,"height":683,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/line-of-sight-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/line-of-sight.png","medium-width":382,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/line-of-sight.png","medium_large-width":768,"medium_large-height":525,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/line-of-sight.png","large-width":1000,"large-height":683,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/line-of-sight.png","1536x1536-width":1000,"1536x1536-height":683,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/line-of-sight.png","2048x2048-width":1000,"2048x2048-height":683,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/line-of-sight-681x465.png","card_image-width":681,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/line-of-sight.png","wide_image-width":1000,"wide_image-height":683}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/codepen.io\/ralucanicola\/pen\/OJJxvRe?&editable=true&editors=100"},{"acf_fc_layout":"content","content":"<p class=\"graf graf--p\">So let\u2019s start with the app that helps you plant trees in Manhattan: when a user clicks or moves the mouse over a building, then trees are placed randomly over the 2D extent of the building. The extent is retrieved by querying the <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-layers-SceneLayerView.html\">SceneLayerView<\/a> and the coordinates are calculated with a <a href=\"https:\/\/github.com\/RalucaNicola\/JSAPI_demos\/blob\/master\/greenify-city\/index.html#L223\">random function<\/a> inside of that extent. Sometimes there might be trees set on the ground because the extent is different from the footprint. Using <code class=\"markup--code markup--p-code\">relative-to-scene<\/code> <a class=\"markup--anchor markup--p-anchor\" href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-layers-GraphicsLayer.html#elevationInfo\" target=\"_blank\" rel=\"noopener\" data-href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-layers-GraphicsLayer.html#elevationInfo\">elevation mode<\/a>, the trees are aligned to the building height. We are only interested in capturing the intersected buildings, so we\u2019ll use the <code class=\"markup--code markup--p-code\">include<\/code> option of the <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html#hitTest\">hitTest<\/a> method, which will disregard all other layers:<\/p>\n"},{"acf_fc_layout":"content","content":"<pre><code style=\"padding: 0.5em; color: #333; background: #f8f8f8;\">\r\nview.hitTest(event, { include: [buildingSceneLayer] })\r\n  .then(<span style=\"color: #333; font-weight: bold;\">function<\/span> (response) {\r\n    <span style=\"color: #998; font-style: italic;\">\/\/ response.results contains all the intersected graphics<\/span>\r\n   });\r\n\r\n<\/code><\/pre>\n"},{"acf_fc_layout":"content","content":"<p>Another rule of the app is that it plants more trees on buildings that are closer to the camera. How do we do that? We check the distance in the response of the <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html#hitTest\">hitTest<\/a> method. If the camera is further away than 500m from the building, only 5 trees are planted. Otherwise it will plant 20 trees.<\/p>\n"},{"acf_fc_layout":"content","content":"<pre><code style=\"padding: 0.5em; color: #333; background: #f8f8f8;\">\r\n  view.hitTest(event, { include: [buildingSceneLayer] })\r\n    .then(<span style=\"color: #333; font-weight: bold;\">function<\/span> (response) {\r\n      response.results.forEach(<span style=\"color: #333; font-weight: bold;\">function<\/span>(result) {\r\n        <span style=\"color: #333; font-weight: bold;\">const<\/span> objectid = result.graphic.attributes.OBJECTID;\r\n        <span style=\"color: #333; font-weight: bold;\">const<\/span> noTrees = result.distance &gt; <span style=\"color: #008080;\">500<\/span> ? <span style=\"color: #008080;\">5<\/span> : <span style=\"color: #008080;\">20<\/span>;\r\n        sceneLayerView.queryExtent({ objectIds: [objectid] })\r\n          .then(<span style=\"color: #333; font-weight: bold;\">function<\/span> (result) {\r\n            <span style=\"color: #333; font-weight: bold;\">if<\/span> (result &amp;&amp; result.extent) {\r\n              <span style=\"color: #333; font-weight: bold;\">const<\/span> trees = getRandomTrees(result.extent, noTrees);\r\n              treesLayer.addMany(trees);\r\n            }\r\n          });\r\n      });\r\n    });\r\n\r\n  <\/code><\/pre>\n"},{"acf_fc_layout":"content","content":"<p class=\"graf graf--p\">As I mentioned in the beginning, the results array of the <a class=\"markup--anchor markup--p-anchor\" href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html#HitTestResult\" target=\"_blank\" rel=\"noopener\" data-href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html#HitTestResult\">HitTestResult<\/a> contains all the intersected buildings. So to plant more trees with a single click\/mouse move I can just tilt the view and more buildings will be intersected:<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":666512,"id":666512,"title":"hit-trees","filename":"hit-trees.png","filesize":57905,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hit-trees.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\/hit-trees","alt":"","author":"7011","description":"","caption":"More trees are being planted on the buildings closer to the camera because of the 500m distance rule.","name":"hit-trees","status":"inherit","uploaded_to":666472,"date":"2019-11-26 11:15:28","modified":"2019-11-26 15:00:30","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":700,"height":400,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hit-trees-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hit-trees.png","medium-width":457,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hit-trees.png","medium_large-width":700,"medium_large-height":400,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hit-trees.png","large-width":700,"large-height":400,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hit-trees.png","1536x1536-width":700,"1536x1536-height":400,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hit-trees.png","2048x2048-width":700,"2048x2048-height":400,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hit-trees.png","card_image-width":700,"card_image-height":400,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hit-trees.png","wide_image-width":700,"wide_image-height":400}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"<p class=\"graf graf--p\">To get a visual representation of how this works, check out our <a class=\"markup--anchor markup--p-anchor\" href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/sceneview-hittest\/index.html\" target=\"_blank\" rel=\"noopener\" data-href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/sceneview-hittest\/index.html\">SceneView hitTest documentation sample<\/a>:<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":666622,"id":666622,"title":"hittest-sample","filename":"hittest-sample.png","filesize":83893,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hittest-sample.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\/hittest-sample","alt":"","author":"7011","description":"","caption":"ArcGIS API for JavaScript sample - SceneView hitTest","name":"hittest-sample","status":"inherit","uploaded_to":666472,"date":"2019-11-26 14:51:33","modified":"2019-11-26 14:52:13","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":903,"height":506,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hittest-sample-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hittest-sample.png","medium-width":464,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hittest-sample.png","medium_large-width":768,"medium_large-height":430,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hittest-sample.png","large-width":903,"large-height":506,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hittest-sample.png","1536x1536-width":903,"1536x1536-height":506,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hittest-sample.png","2048x2048-width":903,"2048x2048-height":506,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hittest-sample-826x463.png","card_image-width":826,"card_image-height":463,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/hittest-sample.png","wide_image-width":903,"wide_image-height":506}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/sceneview-hittest\/index.html"},{"acf_fc_layout":"content","content":"<p>This sample also shows the intersection with the ground, which can also be retrieved from the <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html#HitTestResult\">HitTestResult<\/a> along with the distance to the ground. And if we tweak the colors a little we can almost create a small line of sight tool from the camera direction to the point where we clicked. Red represents the part that is not visible and blue is what the observer can see.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":666662,"id":666662,"title":"intersections","filename":"intersections.png","filesize":70274,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/intersections.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\/intersections","alt":"","author":"7011","description":"","caption":"The example live: https:\/\/codepen.io\/ralucanicola\/pen\/OJJxvRe?&amp;editable=true&amp;editors=100","name":"intersections","status":"inherit","uploaded_to":666472,"date":"2019-11-26 15:30:43","modified":"2019-11-26 16:37:00","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":1044,"height":407,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/intersections-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/intersections.png","medium-width":464,"medium-height":181,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/intersections.png","medium_large-width":768,"medium_large-height":299,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/intersections.png","large-width":1044,"large-height":407,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/intersections.png","1536x1536-width":1044,"1536x1536-height":407,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/intersections.png","2048x2048-width":1044,"2048x2048-height":407,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/intersections-826x322.png","card_image-width":826,"card_image-height":322,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/intersections.png","wide_image-width":1044,"wide_image-height":407}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/codepen.io\/ralucanicola\/pen\/OJJxvRe?&editable=true&editors=100"},{"acf_fc_layout":"content","content":"<p>That&#8217;s about it! We&#8217;re always interested in feedback so let us know what you think about this functionality and how it helps you in your workflow.<br \/>\nHappy planting!<br \/>\nRaluca<\/p>\n"}],"authors":[{"ID":7011,"user_firstname":"Raluca","user_lastname":"Nicola","nickname":"Raluca Nicola","user_nicename":"raluca_zurich","display_name":"Raluca Nicola","user_email":"RNicola@esri.com","user_url":"https:\/\/raluca-nicola.net\/","user_registered":"2018-03-02 00:19:07","user_description":"Raluca works as a web cartographer with the Geo Experience Center team at Esri. She loves to play around with web technologies and visualization styles. If she's not in front of the computer, she's probably somewhere up in the mountains.","user_avatar":"<img data-del=\"avatar\" src='https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/7VkWXsZ3_400x400.jpg' class='avatar pp-user-avatar avatar-96 photo ' height='96' width='96'\/>"}],"related_articles":"","card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/card-1.png","wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/banner.png"},"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v25.9 (Yoast SEO v25.9) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Clicking in a 3D web scene can do that?<\/title>\n<meta name=\"description\" content=\"A blog post about increasing interactivity in a 3D web scene by using hitTest in ArcGIS API for JavaScript\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Clicking in a 3D web scene can do that?\" \/>\n<meta property=\"og:description\" content=\"A blog post about increasing interactivity in a 3D web scene by using hitTest in ArcGIS API for JavaScript\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\" \/>\n<meta property=\"og:site_name\" content=\"ArcGIS Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/esrigis\/\" \/>\n<meta property=\"article:modified_time\" content=\"2020-01-29T09:38:03+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@ESRI\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":[\"Article\",\"BlogPosting\"],\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\"},\"author\":{\"name\":\"Raluca Nicola\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/e8fe39abb687cde59f7f1296fbfb24a4\"},\"headline\":\"Clicking in a 3D web scene can do that?\",\"datePublished\":\"2019-11-26T17:05:35+00:00\",\"dateModified\":\"2020-01-29T09:38:03+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\"},\"wordCount\":9,\"publisher\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#organization\"},\"keywords\":[\"EsriRDZurich\",\"hitTest\",\"interactive\",\"web\"],\"articleSection\":[\"3D Visualization &amp; Analytics\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\",\"name\":\"Clicking in a 3D web scene can do that?\",\"isPartOf\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#website\"},\"datePublished\":\"2019-11-26T17:05:35+00:00\",\"dateModified\":\"2020-01-29T09:38:03+00:00\",\"description\":\"A blog post about increasing interactivity in a 3D web scene by using hitTest in ArcGIS API for JavaScript\",\"breadcrumb\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.esri.com\/arcgis-blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Clicking in a 3D web scene can do that?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#website\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/\",\"name\":\"ArcGIS Blog\",\"description\":\"Get insider info from Esri product teams\",\"publisher\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.esri.com\/arcgis-blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#organization\",\"name\":\"Esri\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png\",\"contentUrl\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png\",\"width\":400,\"height\":400,\"caption\":\"Esri\"},\"image\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/esrigis\/\",\"https:\/\/x.com\/ESRI\",\"https:\/\/www.linkedin.com\/company\/5311\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/e8fe39abb687cde59f7f1296fbfb24a4\",\"name\":\"Raluca Nicola\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/7VkWXsZ3_400x400.jpg\",\"contentUrl\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/7VkWXsZ3_400x400.jpg\",\"caption\":\"Raluca Nicola\"},\"description\":\"Raluca works as a web cartographer with the Geo Experience Center team at Esri. She loves to play around with web technologies and visualization styles. If she's not in front of the computer, she's probably somewhere up in the mountains.\",\"sameAs\":[\"https:\/\/raluca-nicola.net\/\",\"https:\/\/www.linkedin.com\/in\/raluca-nicola-cartography\/\",\"https:\/\/x.com\/nicolaraluk\"],\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/author\/raluca_zurich\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Clicking in a 3D web scene can do that?","description":"A blog post about increasing interactivity in a 3D web scene by using hitTest in ArcGIS API for JavaScript","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that","og_locale":"en_US","og_type":"article","og_title":"Clicking in a 3D web scene can do that?","og_description":"A blog post about increasing interactivity in a 3D web scene by using hitTest in ArcGIS API for JavaScript","og_url":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that","og_site_name":"ArcGIS Blog","article_publisher":"https:\/\/www.facebook.com\/esrigis\/","article_modified_time":"2020-01-29T09:38:03+00:00","twitter_card":"summary_large_image","twitter_site":"@ESRI","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":["Article","BlogPosting"],"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that#article","isPartOf":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that"},"author":{"name":"Raluca Nicola","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/e8fe39abb687cde59f7f1296fbfb24a4"},"headline":"Clicking in a 3D web scene can do that?","datePublished":"2019-11-26T17:05:35+00:00","dateModified":"2020-01-29T09:38:03+00:00","mainEntityOfPage":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that"},"wordCount":9,"publisher":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#organization"},"keywords":["EsriRDZurich","hitTest","interactive","web"],"articleSection":["3D Visualization &amp; Analytics"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that","url":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that","name":"Clicking in a 3D web scene can do that?","isPartOf":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#website"},"datePublished":"2019-11-26T17:05:35+00:00","dateModified":"2020-01-29T09:38:03+00:00","description":"A blog post about increasing interactivity in a 3D web scene by using hitTest in ArcGIS API for JavaScript","breadcrumb":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/3d-gis\/clicking-in-a-3d-web-scene-can-do-that#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.esri.com\/arcgis-blog\/"},{"@type":"ListItem","position":2,"name":"Clicking in a 3D web scene can do that?"}]},{"@type":"WebSite","@id":"https:\/\/www.esri.com\/arcgis-blog\/#website","url":"https:\/\/www.esri.com\/arcgis-blog\/","name":"ArcGIS Blog","description":"Get insider info from Esri product teams","publisher":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.esri.com\/arcgis-blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.esri.com\/arcgis-blog\/#organization","name":"Esri","url":"https:\/\/www.esri.com\/arcgis-blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png","contentUrl":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png","width":400,"height":400,"caption":"Esri"},"image":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/esrigis\/","https:\/\/x.com\/ESRI","https:\/\/www.linkedin.com\/company\/5311\/"]},{"@type":"Person","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/e8fe39abb687cde59f7f1296fbfb24a4","name":"Raluca Nicola","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/image\/","url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/7VkWXsZ3_400x400.jpg","contentUrl":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/7VkWXsZ3_400x400.jpg","caption":"Raluca Nicola"},"description":"Raluca works as a web cartographer with the Geo Experience Center team at Esri. She loves to play around with web technologies and visualization styles. If she's not in front of the computer, she's probably somewhere up in the mountains.","sameAs":["https:\/\/raluca-nicola.net\/","https:\/\/www.linkedin.com\/in\/raluca-nicola-cartography\/","https:\/\/x.com\/nicolaraluk"],"url":"https:\/\/www.esri.com\/arcgis-blog\/author\/raluca_zurich"}]}},"text_date":"November 26, 2019","author_name":"Raluca Nicola","author_page":"https:\/\/www.esri.com\/arcgis-blog\/author\/raluca_zurich","custom_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/banner.png","primary_product":"ArcGIS Maps SDK for JavaScript","tag_data":[{"term_id":549072,"name":"EsriRDZurich","slug":"esrirdzurich","term_group":0,"term_taxonomy_id":549072,"taxonomy":"post_tag","description":"","parent":0,"count":96,"filter":"raw"},{"term_id":514502,"name":"hitTest","slug":"hittest","term_group":0,"term_taxonomy_id":514502,"taxonomy":"post_tag","description":"","parent":0,"count":1,"filter":"raw"},{"term_id":368782,"name":"interactive","slug":"interactive","term_group":0,"term_taxonomy_id":368782,"taxonomy":"post_tag","description":"","parent":0,"count":5,"filter":"raw"},{"term_id":29401,"name":"web","slug":"web","term_group":0,"term_taxonomy_id":29401,"taxonomy":"post_tag","description":"","parent":0,"count":17,"filter":"raw"}],"category_data":[{"term_id":23771,"name":"3D Visualization &amp; Analytics","slug":"3d-gis","term_group":0,"term_taxonomy_id":23771,"taxonomy":"category","description":"","parent":0,"count":687,"filter":"raw"}],"product_data":[{"term_id":36831,"name":"ArcGIS Maps SDK for JavaScript","slug":"js-api-arcgis","term_group":0,"term_taxonomy_id":36831,"taxonomy":"product","description":"","parent":36601,"count":363,"filter":"raw"}],"primary_product_link":"https:\/\/www.esri.com\/arcgis-blog\/?s=#&products=js-api-arcgis","_links":{"self":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog\/666472","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog"}],"about":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/types\/blog"}],"author":[{"embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/users\/7011"}],"replies":[{"embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/comments?post=666472"}],"version-history":[{"count":0,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog\/666472\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/media?parent=666472"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/categories?post=666472"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/tags?post=666472"},{"taxonomy":"industry","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/industry?post=666472"},{"taxonomy":"product","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/product?post=666472"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}