Add a vector tile layer | Mapbox GL JS | ArcGIS Developer

Add a vector tile source. You use a source of type vector to add the vector tiles. The source tells Mapbox GL JS how to access the data ... DocumentationMapboxGLJSGuideIntroductionKeyconceptsTutorialsServicesMapsDisplayamapChangethebasemaplayerLayersAddavectortilelayerAddafeaturelayerasGeoJSONAddarastertilelayerDisplayapop-upQueryQueryafeaturelayer(SQL)Queryafeaturelayer(spatial)VisualizationStyleafeaturelayerDisplayacustomvectortilestyleSearchSearchforanaddressReversegeocodeFindplacesRoutingFindarouteanddirectionsFindserviceareasDemographicsQuerydemographicdataToolsSecurityLicenseanddeploymentGlossaryNavigationMenuAddavectortilelayerLearnhowtoaddavectortilelayertoamap.AvectortilelayerisahosteddatalayerintheArcGISPlatform.Thedataisvectortiledata.Youcancreateavectortilelayerbypublishingyourdatawithdatamanagementtools.TodisplayvectortilesinMapboxGLJS,youcreateasourcetoretrievethetiles,andalayertodisplaythem.Inthistutorial,youdisplayaparcelslayerfromapublicvectortileservice,usingthedefaultstyling.Tolearnhowtopublishyourownvectortilelayer,visitDatahostingservicesintheMappingAPIandlocationservicesguide.PrerequisitesYouneedanArcGISaccounttoaccessthedeveloperdashboardandcreateanAPIkey.StepsCreateanewpenTogetstarted,eithercompletetheDisplayamaptutorialorusethispen.SettheAPIkeyToaccesslocationservices,youneedanAPIkeyorOAuth2.0accesstoken.Tolearnmoreaboutauthenticationmethodsandhowtogetaccesstokens,seeSecurityandauthentication.GotoyourdashboardtogetanAPIkey.TheAPIkeymustbescopedtoaccesstheservicesusedinthistutorial.InCodePen,updateapiKeytouseyourkey.          Changeline1 2 3 4 5 6 7 8 9 10 // constapiKey="YOUR_API_KEY"; constbasemapEnum="ArcGIS:Streets"; constmap=newmapboxgl.Map({ container:"map",//theidofthedivelement style:`https://basemaps-api.arcgis.com/arcgis/rest/services/styles/${basemapEnum}?type=style&token=${apiKey}`, zoom:12,//startingzoom center:[-118.805,34.027]//startinglocation[longitude,latitude] }); AddaloadeventhandlerYouneedtowaitforthemaptobecompletelyloadedbeforeaddinganylayersAddaneventhandlertothemaploadevent.MoreinfoFormoreinformationabouttheloadevent,seetheMapboxGLJSdocumentation.Showmorelines                                                             Addline.Addline.Addline.Addline.1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61