<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:taxo="http://purl.org/rss/1.0/modules/taxonomy/" version="2.0">
  <channel>
    <title>topic Re: Custom HTML markers possible?  in ArcGIS JavaScript Maps SDK Questions</title>
    <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/custom-html-markers-possible/m-p/345934#M31914</link>
    <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P&gt;Hi Chris&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;This answer might be a bit late, but&amp;nbsp;here is the way I did what you want to achieve:&lt;BR /&gt;The SceneView of the API has the &lt;A href="http://jscore.esri.com/javascript/latest/api-reference/esri-views-SceneView.html#toScreen"&gt;toScreen() &lt;/A&gt;function, which takes any 3D point on the map and returns that point's [x, y] pixel coordinates on&amp;nbsp;the viewport (x is measured from the left edge of the screen and y from the top edge). So, whenever the camera changes, you can call toScreen() for every HTML marker element you have and update the&amp;nbsp;marker's position&amp;nbsp;on screen accordingly via CSS.&amp;nbsp;&lt;BR /&gt;If you want to test whether a marker is still on the screen, you can access the viewport's extends via the &lt;A href="http://jscore.esri.com/javascript/latest/api-reference/esri-views-SceneView.html#size"&gt;size &lt;/A&gt;property of the SceneView. Compare the marker's x and y coordinates to the viewport's&amp;nbsp;size and decide whether the marker should still be displayed or not.&amp;nbsp;&lt;BR /&gt;I hope this helps.&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
    <pubDate>Mon, 26 Feb 2018 09:51:12 GMT</pubDate>
    <dc:creator>ManuelBraunschweiler</dc:creator>
    <dc:date>2018-02-26T09:51:12Z</dc:date>
    <item>
      <title>Custom HTML markers possible?</title>
      <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/custom-html-markers-possible/m-p/345933#M31913</link>
      <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P&gt;This may be a simple questions. I've been evaluating the JavaScript 4 framework for use and so far its great! But i'm stuck on one simple task that seems to be common place in other frameworks.&amp;nbsp;&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;Can you make a 'marker' on the map that is just arbitrary HTML? For example my current app uses google maps and ember to make a dynamic SVG that i use to create a marker on the map with for things like planes, boats, cars, and people.&amp;nbsp; I'm able to alter the colors, animate it, scale and rotate it. Another example is in Google Maps I'm able to arrange custom HTML&amp;nbsp;snippets and lock them to geographic point while still maintaining the ability to style them using CSS.&amp;nbsp;&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;The 3D maps for ArcGIS is really, really appealing but this is a killer. The documentation doesn't seem so clear about the ability for 'widgets' to be used inside a SceneView. All the examples seem to show 'widgets' just hovering over the map and nothing more. Using a CustomLayer with a custom Renderer doesn't seem to have a way to do this either as all the examples are related to spatial data display and not individual point data that may render and behave completely differently from each other.&amp;nbsp;&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
      <pubDate>Fri, 26 Jan 2018 16:11:05 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/custom-html-markers-possible/m-p/345933#M31913</guid>
      <dc:creator>ChrisRice5</dc:creator>
      <dc:date>2018-01-26T16:11:05Z</dc:date>
    </item>
    <item>
      <title>Re: Custom HTML markers possible?</title>
      <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/custom-html-markers-possible/m-p/345934#M31914</link>
      <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P&gt;Hi Chris&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;This answer might be a bit late, but&amp;nbsp;here is the way I did what you want to achieve:&lt;BR /&gt;The SceneView of the API has the &lt;A href="http://jscore.esri.com/javascript/latest/api-reference/esri-views-SceneView.html#toScreen"&gt;toScreen() &lt;/A&gt;function, which takes any 3D point on the map and returns that point's [x, y] pixel coordinates on&amp;nbsp;the viewport (x is measured from the left edge of the screen and y from the top edge). So, whenever the camera changes, you can call toScreen() for every HTML marker element you have and update the&amp;nbsp;marker's position&amp;nbsp;on screen accordingly via CSS.&amp;nbsp;&lt;BR /&gt;If you want to test whether a marker is still on the screen, you can access the viewport's extends via the &lt;A href="http://jscore.esri.com/javascript/latest/api-reference/esri-views-SceneView.html#size"&gt;size &lt;/A&gt;property of the SceneView. Compare the marker's x and y coordinates to the viewport's&amp;nbsp;size and decide whether the marker should still be displayed or not.&amp;nbsp;&lt;BR /&gt;I hope this helps.&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
      <pubDate>Mon, 26 Feb 2018 09:51:12 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/custom-html-markers-possible/m-p/345934#M31914</guid>
      <dc:creator>ManuelBraunschweiler</dc:creator>
      <dc:date>2018-02-26T09:51:12Z</dc:date>
    </item>
  </channel>
</rss>

