Lightship map - can not add a custom point to the map

🧑‍💻 Technical Support
1

Hi
I want to add a custom point in the map based on a given latitude and longitude.
From my understanding of the documentation, i can easily do that with the primitive , because it says

Adds a point at a specified lat/lng to the <lightship-map> . This primitive element should be a child of <lightship-map> . This can be used to add custom content at a point in the map, and its position can be updated over time, e.g. to lerp between lat/lng coordinates.

So here is what i did

  <lightship-map 
    id="m"
    scale="100 100 100"
    map-debug-controls
    lightship-map-theme="theme: nighttime"
    map-add-point-component
    lightship-map-add-wayspots="primitive: a-cylinder; meters: 10;">
    <a-cone
      rotation="-90 0 0"
      material="color: #CFFF04; metalness: .7; roughness: 1.0"
      height=".02"
      radius-top="0"
      radius-bottom=".005"
      lightship-map-motion-direction>
    </a-cone>
    <lightship-map-point
      id="yes"
      lat-lng="45.53106 -73.610142"
      meters="5"
      min="0"
      lightship-map-point>
      <a-cone
        material="color: #FF0000; metalness: .7; roughness: 1.0"
        height=".02"
        radius-top="0"
        radius-bottom=".005">
      </a-cone>
    </lightship-map-point>
    
  </lightship-map>

But i dont get any error but i cant see the cone anywhere. What i’m missing here ?

Thank you very much,

Anna

2

You code looks good to me, I think your attached to the custom point is simply too small and perhaps the “player” cone is overlapping it. Using your code, initially this is what I see:

<lightship-map-point lat-lng="37.428381 -122.144811" meters="5" min="0">
      <a-cone
        material="color: #FF0000; metalness: .7; roughness: 1.0"
        height=".02"
        radius-top="0"
        radius-bottom=".005">
      </a-cone>
    </lightship-map-point>

Screenshot 2024-04-18 at 1.07.33 PM

After adjusting (add 1) the height, and radius-bottom, and nothing else, I see the point on my map as expected:

    <lightship-map-point lat-lng="37.428381 -122.144811" meters="5" min="0">
      <a-cone
        material="color: #FF0000; metalness: .7; roughness: 1.0"
        height="1.02"
        radius-top="0"
        radius-bottom="1.005">
      </a-cone>
    </lightship-map-point>

Screenshot 2024-04-18 at 1.06.33 PM

1 Like
3

Thank you so much i feel super dumb but thank you so much.

Have a nice day

4

No worries at all! Glad to hear it was a simple fix :slight_smile:

1 Like