title: How to add Markes to a Leaflet-map with coordinates from Supabase database?
body: <p>I want to add some Markers from coordinates stored in a supabase database colomn.</p>
  <p>Here is my vue code:</p>
  <pre><code>&lt;l-marker v-for=&quot;(marker, index) in markers&quot; :key=&quot;index&quot; ref=&quot;markersRef&quot; :lat-lng=&quot;marker.position&quot;&gt;&lt;/l-marker&gt;
  </code></pre>
  <p>I'm script:</p>
  <pre><code>  export default {
     async created() {
      const { data: events, error } = await this.$supabase
       .from('events')
       .select('coordinates')
      this.markers = events
      this.loaded = true
      console.log(this.markers)
      
     },
    data: () =&gt; ({
     markers: [],
    }),
   }
  </code></pre>
  <p>If I output markes, the result is:</p>
  <pre class="lang-json prettyprint-override"><code>[
     { &quot;coordinates&quot;: &quot;lat: 59.339025, lng: 18.065818&quot; },
     { &quot;coordinates&quot;: &quot;lat: 59.923043, lng: 10.752839&quot; }
  ] 
  </code></pre>
  <p>the error is: &quot;latlng is Null&quot;</p>