PageSourceSearch

https://analyticsindiamag.com/assets/Infographics-DdaEgjlX.js

js analyticsindiamag.com collected 2026-09-24 08:27:07 UTC 13,433 bytes, 6 lines download raw bytes

1import{r as i,j as e,H,ah as B,m as u,q as O,X as Z,G as S,o as j,_ as q,F as N,A as G,K as J}from"./index-KSWbwNeY.js";import{D as K,a as Q}from"./dialog-Bpfij23O.js";import U from"./Footer-DPSMpmUX.js";import{P as W,a as X,b as y,c as Y,e as ee,d as te,f as ae}from"./pagination-BF8fs3MF.js";import{Z as D}from"./zoom-in-DZK_VH4x.js";import"./index-BpbyRUKB.js";import"./twitter-yEUqfNJX.js";import"./linkedin-B1bA0DJP.js";import"./youtube-CwivUiPT.js";import"./facebook-DahhNxAJ.js";import"./chevron-left-C0OR5oyH.js";import"./ellipsis-aIaacu3o.js";const _="https://analyticsindiamag.com",w=24,he=()=>{const[p,E]=i.useState([]),[$,k]=i.useState(!0),[h,I]=i.useState(""),[c,T]=i.useState(""),[r,g]=i.useState(1),[A,M]=i.useState(0),[s,b]=i.useState(null);i.useEffect(()=>{const t=setTimeout(()=>{T(h),g(1)},300);return()=>clearTimeout(t)},[h]),i.useEffect(()=>{(async()=>{k(!0);const n=(r-1)*w;let x=J.from("infographics").select(`
2          id, title, image_url, alt_text, caption, pdf_url, created_at,
3          post_infographics(
4            posts(title, slug)
5          )
6        `,{count:"exact"}).order("created_at",{ascending:!1});c&&(x=x.ilike("title",`%${c}%`)),x=x.range(n,n+w-1);const{data:R,count:V}=await x,z=(R||[]).map(l=>{var P,C;const d=(C=(P=l.post_infographics)==null?void 0:P[0])==null?void 0:C.posts;return{id:l.id,title:l.title,image_url:l.image_url,alt_text:l.alt_text,caption:l.caption,pdf_url:l.pdf_url,created_at:l.created_at,article_title:(d==null?void 0:d.title)||null,article_slug:(d==null?void 0:d.slug)||null}});E(z),M(V||0),k(!1)})()},[r,c]);const m=Math.ceil(A/w),o=t=>t.article_title||t.title,a=r===1&&!c?p[0]:void 0,F=a?p.slice(1):p,f=`${_}/infographics`,L={"@context":"https://schema.org","@type":"CollectionPage",name:"Infographics - AI and Tech Data Visuals",description:"Browse our collection of AI, tech and data science infographics — visual insights on trends, technologies, and industry analysis.",url:f,isPartOf:{"@type":"WebSite",name:"AIM",url:_},mainEntity:{"@type":"ItemList",itemListElement:p.slice(0,30).map((t,n)=>({"@type":"ListItem",position:n+1,name:t.article_title||t.title,url:t.article_slug?`${_}/${t.article_slug}`:f,image:t.image_url}))}},v=t=>new Date(t).toLocaleDateString("en-IN",{day:"numeric",month:"short",year:"numeric",timeZone:"Asia/Kolkata"});
6return e.jsxs(e.Fragment,{children:[e.jsxs(H,{children:[e.jsx("title",{children:"Infographics - AI and Tech Data Visualization | AIM"}),e.jsx("meta",{name:"description",content:"Browse our collection of AI, tech and data science infographics — visual insights on trends, technologies, and industry analysis."}),e.jsx("link",{rel:"canonical",href:f}),e.jsx("meta",{property:"og:title",content:"Infographics - AI and Tech Data Visualization | AIM"}),e.jsx("meta",{property:"og:description",content:"Browse our collection of AI, tech and data science infographics — visual insights on trends, technologies, and industry analysis."}),e.jsx("meta",{property:"og:type",content:"website"}),e.jsx("meta",{property:"og:url",content:f}),e.jsx("script",{type:"application/ld+json",children:JSON.stringify(L)})]}),e.jsx(B,{}),e.jsxs("main",{className:"min-h-screen bg-background",children:[e.jsxs("section",{className:"relative overflow-hidden border-b border-border",children:[e.jsx("div",{"aria-hidden":!0,className:"pointer-events-none absolute -top-40 -left-32 h-[26rem] w-[26rem] rounded-full bg-primary/10 blur-3xl"}),e.jsx("div",{"aria-hidden":!0,className:"pointer-events-none absolute -bottom-52 right-0 h-[30rem] w-[30rem] rounded-full bg-accent/20 blur-3xl"}),e.jsx("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 opacity-[0.06] [background-image:linear-gradient(to_right,currentColor_1px,transparent_1px),linear-gradient(to_bottom,currentColor_1px,transparent_1px)] [background-size:56px_56px]"}),e.jsxs("div",{className:"page-container relative py-16 md:py-24",children:[e.jsxs(u.div,{initial:{opacity:0,y:18},animate:{opacity:1,y:0},transition:{duration:.6,ease:[.22,1,.36,1]},className:"max-w-3xl",children:[e.jsxs("span",{className:"inline-flex items-center gap-2 rounded-full border border-border bg-card/60 px-3 py-1 text-[11px] uppercase tracking-[0.18em] text-muted-foreground backdrop-blur",children:[e.jsx("span",{className:"h-1.5 w-1.5 rounded-full bg-primary"}),"AIM Visual Desk"]}),e.jsxs("h1",{className:"mt-6 font-serif text-4xl leading-[1.05] text-foreground md:text-6xl lg:text-7xl",children:["Infographics",e.jsx("span",{className:"block text-muted-foreground",children:"AI & tech, drawn to scale."})]}),e.jsx("p",{className:"mt-5 max-w-xl text-base text-muted-foreground md:text-lg",children:"Visual insights on AI, tech, data science and emerging technologies — reported, charted and published by the AIM newsroom."})]}),e.jsxs(u.div,{initial:{opacity:0,y:18},animate:{opacity:1,y:0},transition:{duration:.6,delay:.12,ease:[.22,1,.36,1]},className:"mt-10 flex flex-col gap-5 md:flex-row md:items-center md:justify-between",children:[e.jsxs("div",{className:"group relative w-full max-w-xl",children:[e.jsx("div",{className:"pointer-events-none absolute inset-0 rounded-full bg-primary/10 opacity-0 blur-md transition-opacity duration-300 group-focus-within:opacity-100"}),e.jsx(O,{className:"pointer-events-none absolute left-5 top-1/2 h-5 w-5 -translate-y-1/2 text-muted-foreground transition-colors group-focus-within:text-primary"}),e.jsx("input",{type:"search",placeholder:"Search infographics…",value:h,onChange:t=>I(t.target.value),className:"relative w-full rounded-full border border-border bg-card/80 py-4 pl-14 pr-12 text-base text-foreground shadow-sm outline-none backdrop-blur transition-all duration-300 placeholder:text-muted-foreground focus:border-primary/50 focus:shadow-lg"}),h&&e.jsx("button",{onClick:()=>I(""),"aria-label":"Clear search",className:"absolute right-4 top-1/2 -translate-y-1/2 rounded-full p-1 text-muted-foreground transition-colors hover:text-foreground",children:e.jsx(Z,{className:"h-4 w-4"})})]}),e.jsxs("div",{className:"flex items-baseline gap-2 text-sm text-muted-foreground",children:[e.jsx("span",{className:"font-serif text-3xl text-foreground",children:A}),e.jsx("span",{className:"uppercase tracking-[0.16em] text-xs",children:"visuals published"})]})]})]})]}),e.jsxs("div",{className:"page-container py-12 md:py-16",children:[$?e.jsx("div",{className:"grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-3",children:Array.from({length:6}).map((t,n)=>e.jsxs("div",{className:"space-y-3",children:[e.jsx(S,{className:"aspect-[3/4] w-full rounded-2xl"}),e.jsx(S,{className:"h-4 w-3/4"})]},n))}):p.length===0?e.jsxs("div",{className:"py-24 text-center",children:[e.jsx("p",{className:"font-serif text-2xl text-foreground",children:"Nothing here yet"}),e.jsx("p",{className:"mt-2 text-muted-foreground",children:c?`No infographics match “${c}”.`:"No infographics available yet."})]}):e.jsxs(e.Fragment,{children:[a&&e.jsxs(u.section,{initial:{opacity:0,y:24}
6,animate:{opacity:1,y:0},transition:{duration:.7,ease:[.22,1,.36,1]},className:"mb-16 grid grid-cols-1 gap-8 lg:grid-cols-[1.15fr_0.85fr] lg:items-center",children:[e.jsxs("button",{onClick:()=>b(a),className:"group relative block w-full overflow-hidden rounded-3xl border border-border bg-muted text-left",children:[e.jsx("div",{className:"aspect-[4/3] w-full overflow-hidden",children:e.jsx("img",{src:a.image_url,alt:a.alt_text||o(a),className:"h-full w-full object-cover object-top transition-transform duration-[900ms] ease-out group-hover:scale-[1.04]"})}),e.jsx("div",{className:"absolute inset-0 bg-gradient-to-t from-black/40 via-transparent to-transparent opacity-0 transition-opacity duration-500 group-hover:opacity-100"}),e.jsxs("span",{className:"absolute bottom-5 left-5 inline-flex items-center gap-2 rounded-full bg-background/90 px-4 py-2 text-xs uppercase tracking-[0.14em] text-foreground opacity-0 backdrop-blur transition-all duration-500 group-hover:opacity-100",children:[e.jsx(D,{className:"h-3.5 w-3.5"})," Expand"]})]}),e.jsxs("div",{children:[e.jsx("span",{className:"text-[11px] uppercase tracking-[0.22em] text-primary",children:"Latest visual"}),e.jsx("h2",{className:"mt-4 font-serif text-3xl leading-tight text-foreground md:text-4xl",children:a.article_slug?e.jsx(j,{to:`/${a.article_slug}`,className:"transition-colors hover:text-primary",children:o(a)}):o(a)}),a.caption&&e.jsx("p",{className:"mt-4 text-muted-foreground",children:a.caption}),e.jsxs("div",{className:"mt-6 flex flex-wrap items-center gap-4 text-sm",children:[e.jsx("span",{className:"text-muted-foreground",children:v(a.created_at)}),a.article_slug&&e.jsxs(j,{to:`/${a.article_slug}`,className:"group inline-flex items-center gap-1.5 text-primary transition-colors hover:text-primary/80",children:["Read the story",e.jsx(q,{className:"h-4 w-4 transition-transform duration-300 group-hover:-translate-y-0.5 group-hover:translate-x-0.5"})]}),a.pdf_url&&e.jsxs("a",{href:a.pdf_url,target:"_blank",rel:"noopener noreferrer",className:"inline-flex items-center gap-1.5 text-foreground transition-colors hover:text-primary",children:[e.jsx(N,{className:"h-4 w-4"})," PDF"]})]})]})]}),e.jsx(G,{mode:"popLayout",children:e.jsx(u.div,{initial:"hidden",animate:"show",variants:{hidden:{},show:{transition:{staggerChildren:.06}}},className:"grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-3",children:F.map(t=>e.jsxs(u.article,{variants:{hidden:{opacity:0,y:26},show:{opacity:1,y:0,transition:{duration:.55,ease:[.22,1,.36,1]}}},whileHover:{y:-6},className:"group relative flex flex-col overflow-hidden rounded-2xl border border-border bg-card transition-shadow duration-500 hover:shadow-xl",children:[e.jsxs("button",{onClick:()=>b(t),className:"relative block w-full overflow-hidden bg-muted text-left focus:outline-none focus-visible:ring-2 focus-visible:ring-primary/50",children:[e.jsx("div",{className:"aspect-[4/5] w-full overflow-hidden",children:e.jsx("img",{src:t.image_url,alt:t.alt_text||o(t),loading:"lazy",className:"h-full w-full object-cover object-top transition-transform duration-[900ms] ease-out group-hover:scale-[1.05]"})}),e.jsx("div",{className:"absolute inset-0 bg-gradient-to-t from-black/50 via-black/0 to-transparent opacity-0 transition-opacity duration-500 group-hover:opacity-100"}),e.jsxs("span",{className:"absolute bottom-4 left-4 inline-flex translate-y-2 items-center gap-2 rounded-full bg-background/90 px-3 py-1.5 text-[11px] uppercase tracking-[0.14em] text-foreground opacity-0 backdrop-blur transition-all duration-500 group-hover:translate-y-0 group-hover:opacity-100",children:[e.jsx(D,{className:"h-3.5 w-3.5"})," Expand"]})]}),e.jsxs("div",{className:"flex flex-1 flex-col p-5",children:[e.jsx("span",{className:"text-[11px] uppercase tracking-[0.18em] text-muted-foreground",children:v(t.created_at)}),t.article_slug?e.jsx(j,{to:`/${t.article_slug}`,className:"mt-2 font-serif text-lg leading-snug text-foreground transition-colors line-clamp-3 hover:text-primary",children:o(t)}):e.jsx("h2",{className:"mt-2 font-serif text-lg leading-snug text-foreground line-clamp-3",children:o(t)}),t.pdf_url&&e.jsxs("a",{href:t.pdf_url,target:"_blank",rel:"noopener noreferrer",onClick:n=>n.stopPropagation(),className:"mt-auto inline-flex w-fit items-center gap-1.5 pt-4 text-xs text-primary transition-colors hover:text-primary/80",children:[e.jsx(N,{className:"h-3.5 w-3.5"}),"Download PDF"]})]}),e.jsx("span",{className:"pointer-events-none absolute inset-x-0 bottom-0 h-px origin-left scale-x-0 bg-primary transition-transform duration-500 group-hover:scale-x-100"})]},t.id))},`${r}-${c}`)})]}),m>1&&e.jsx("div",{className:"mt-16",children:e.jsx(W,{children:e.jsxs(X,{children:[e.jsx(y,{children:e.jsx(Y,{onClick:()=>g(t=>Math.max(1,t-1)),className:r===1?"pointer-events-none opacity-50":"cursor-pointer"})}),Array.from({length:m},(t,n)=>n+1).map(t=>t===1||t===m||t>=r-1&&t<=r+1?e.jsx(y,{children:e.jsx(ee,{onClick:()=>g(t),isActive:r===t,className:"cursor-pointer",children:t})},t):t===r-2||t===r+2?e.jsx(y,{children:e.jsx(te,{})},t):null),e.jsx(y,{children:e.jsx(ae,{onClick:()=>g(t=>Math.min(m,t+1)),className:r===m?"pointer-events-none opacity-50":"cursor-pointer"})})]})})})]}),e.jsx(K,{open:!!s,onOpenChange:()=>b(null),children:e.jsx(Q,{className:"max-w-5xl max-h-[92vh] overflow-y-auto gap-0 p-0 rounded-2xl",children:s&&e.jsxs(u.div,{initial:{opacity:0,scale:.98}
6,animate:{opacity:1,scale:1},transition:{duration:.35,ease:[.22,1,.36,1]},children:[e.jsx("div",{className:"flex items-center justify-center bg-muted",children:e.jsx("img",{src:s.image_url,alt:s.alt_text||o(s),className:"max-h-[72vh] max-w-full object-contain"})}),e.jsxs("div",{className:"p-6 md:p-8",children:[e.jsx("span",{className:"text-[11px] uppercase tracking-[0.18em] text-muted-foreground",children:v(s.created_at)}),s.article_slug?e.jsx(j,{to:`/${s.article_slug}`,className:"mt-2 block font-serif text-2xl text-foreground transition-colors hover:text-primary",children:o(s)}):e.jsx("h2",{className:"mt-2 font-serif text-2xl text-foreground",children:o(s)}),s.caption&&e.jsx("p",{className:"mt-2 text-muted-foreground",children:s.caption}),s.pdf_url&&e.jsxs("a",{href:s.pdf_url,target:"_blank",rel:"noopener noreferrer",className:"mt-4 inline-flex items-center gap-1.5 text-sm text-primary transition-colors hover:text-primary/80",children:[e.jsx(N,{className:"h-4 w-4"}),"Download PDF"]})]})]})})})]}),e.jsx(U,{})]})};export{he as default};

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.