Schema SiteNavigationElement as JSON-LD Structured Data

Question

I've seen another similar question on this subject, but no accepted correct answer or example. What should the format at this element be? The BreadcrumbList is well documented and contains the list, but not the SiteNavigationElement.

    <script type="application/ld+json">
    {
    "@context": "https://schema.org",
    "@type": "SiteNavigationElement",
    "@graph": [
        {
        "@type": "ListItem",
        "position": 1,
        "item": {
            "@id": "http://www.example.com/",
            "url": "http://www.example.com/",
            "name": "Home"
            }
        },
        {
        "@type": "ListItem",
        "position": 2,
        "item": {
            "@id": "http://www.example.com/contact.html",
            "url": "http://www.example.com/contact.html",
            "name": "Contact"
            }
        },
    ]
    }
    </script>

UPDATE:

Been playing around and have come up with something that works. But is it of the correct structure?

<script type="application/ld+json">
//<![CDATA[
{
"@context": "https:\/\/schema.org\/",
"@type": "SiteNavigationElement",
"headline": "Headline for Site Navigation",
"name": [
    "Home",
    "Tours",
    "Transfers",
    "Taxis",
    "Contact"
    ],
"description": [
    "Homes Desc.",
    "Tours Desc.",
    "Transfers Desc.",
    "Taxis Desc.",
    "Contact Desc."
    ],
"url": [
    "http://www.example.com/",
    "http://www.example.com/tours/",
    "http://www.example.com/transfers/",
    "http://www.example.com/taxis/",
    "http://www.example.com/contact.html"
    ]
}
//]]>
</script>

Solution

I would think that your SiteNavigationElements should be contained in ItemLists, or just included as separate items.

For example as part of a list:

<script type="application/ld+json">
{
  "@context":"http://schema.org",
  "@type":"ItemList",
  "itemListElement":[
    {
      "@type":"SiteNavigationElement",
      "position":1,
      "name": "Home",
      "description": "Homes Desc.",
      "url":"http://www.example.com/"
    },
    {
      "@type":"SiteNavigationElement",
      "position":2,
      "name": "Tours",
      "description": "Tours desc.",
      "url":"http://www.example.com/tours/"
    },

    ...etc

  ]
}
</script>

However, just because you can do this does not mean you should. Check out this relevant answer.

I would think that your SiteNavigationElement URLs should be for the elements themselves on the current page (as opposed to the pages they link to), which usually do not exist.