1"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[4847],{15191:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>i,contentTitle:()=>c,default:()=>h,frontMatter:()=>a,metadata:()=>o,toc:()=>l});var s=t(85893),r=t(11151);const a={custom_edit_url:"https://github.com/rnmapbox/maps/blob/main/src/components/Image.tsx"},c=void 0,o={id:"components/Image",title:"Image",description:"props",source:"@site/docs/components/Image.md",sourceDirName:"components",slug:"/components/Image",permalink:"/docs/components/Image",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/blob/main/src/components/Image.tsx",tags:[],version:"current",frontMatter:{custom_edit_url:"https://github.com/rnmapbox/maps/blob/main/src/components/Image.tsx"},sidebar:"componentSidebar",previous:{title:"HillshadeLayer",permalink:"/docs/components/HillshadeLayer"},next:{title:"ImageSource",permalink:"/docs/components/ImageSource"}},i={},l=[{value:"props",id:"props",level:2},{value:"name",id:"name",level:3},{value:"sdf",id:"sdf",level:3},{value:"stretchX",id:"stretchx",level:3},{value:"stretchY",id:"stretchy",level:3},{value:"content",id:"content",level:3},{value:"scale",id:"scale",level:3},{value:"children",id:"children",level:3},{value:"methods",id:"methods",level:2},{value:"refresh()",id:"refresh",level:3},{value:"arguments",id:"arguments",level:4}];function d(e){const n={a:"a",code:"code",em:"em",h2:"h2",h3:"h3",h4:"h4",p:"p",pre:"pre",table:"table",th:"th",thead:"thead",tr:"tr",...(0,r.a)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",children:"import { Image } from '@rnmapbox/maps';\n\nImage\n\n"})}),"\n",(0,s.jsx)(n.h2,{id:"props",children:"props"}),"\n",(0,s.jsx)(n.h3,{id:"name",children:"name"}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",children:"string\n"})}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.em,{children:"required"}),"\nID of the image"]}),"\n",(0,s.jsx)(n.h3,{id:"sdf",children:"sdf"}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",children:"boolean\n"})}),"\n",(0,s.jsxs)(n.p,{children:["Make image an sdf optional - see ",(0,s.jsx)(n.a,{href:"https://docs.mapbox.com/help/troubleshooting/using-recolorable-images-in-mapbox-maps/",children:"SDF icons"})]}),"\n",(0,s.jsx)(n.h3,{id:"stretchx",children:"stretchX"}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",children:"Array\n"})}),"\n",(0,s.jsx)(n.p,{children:"An array of two-element arrays, consisting of two numbers that represent, the from position and the to position of areas that can be stretched horizontally."}),"\n",(0,s.jsx)(n.h3,{id:"stretchy",children:"stretchY"}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",children:"Array\n"})}),"\n",(0,s.jsx)(n.p,{children:"An array of two-element arrays, consisting of two numbers that represent, the from position and the to position of areas that can be stretched vertically."}),"\n",(0,s.jsx)(n.h3,{id:"content",children:"content"}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",children:"tuple\n"})}),"\n",(0,s.jsx)(n.p,{children:"An array of four numbers, with the first two specifying the left, top\ncorner, and the last two specifying the right, bottom corner. If present, and if the\nicon uses icon-text-fit, the symbol's text will be fit inside the content box."}),"\n",(0,s.jsx)(n.h3,{id:"scale",children:"scale"}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",children:"number\n"})}),"\n",(0,s.jsx)(n.p,{children:"Scale factor for the image."}),"\n",(0,s.jsx)(n.h3,{id:"children",children:"children"}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",children:"ReactElement\n"})}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.em,{children:"required"}),"\nSingle react native view rendering the image"]}),"\n",(0,s.jsx)(n.h2,{id:"methods",children:"methods"}),"\n",(0,s.jsx)(n.h3,{id:"refresh",children:"refresh()"}),"\n",(0,s.jsx)(n.h4,{id:"arguments",children:"arguments"}),"\n",(0,s.jsx)(n.table,{children:(0,s.jsx)(n.thead,{children:(0,s.jsxs)(n.tr,{children:[(0,s.jsx)(n.th,{children:"Name"}),(0,s.jsx)(n.th,{style:{textAlign:"center"},children:"Type"}),(0,s.jsx)(n.th,{style:{textAlign:"center"},children:"Required"}),(0,s.jsx)(n.th,{style:{textAlign:"center"},children:"Description"})]})})})]})}function h(e={}){const{wrapper:n}={...(0,r.a)(),...e.components};return n?(0,s.jsx)(n,{...e,children:(0,s.jsx)(d,{...e})}):d(e)}},11151:(e,n,t)=>{t.d(n,{Z:()=>o,a:()=>c});var s=t(67294);const r={},a=s.createContext(r);function c(e){const n=s.useContext(a);return s.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}function o(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(r):e.components||r:c(e.components),s.createElement(a.Provider,{value:n},e.children)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.