Voltar ao blog de BIM e IFC
Ferramentas e comparativos · 2026-10-01 · 9 min
Como incorporar um visualizador IFC num site, num CDE ou num relatório do Power BI
Um modelo 3D interativo numa proposta, numa página de projeto, num painel de CDE ou num dashboard do Power BI — com um iframe, sem build e sem enviar o modelo para o servidor de ninguém. O que fazem os parâmetros de URL e quando você precisa do SDK.
Como incorporar um visualizador IFC num site, num CDE ou num relatório do Power BI — IFC Viewer Online article cover
Capturas de tela de um modelo BIM são uma coisa estranha de pôr numa proposta. A graça do modelo é ser tridimensional e cheio de dados, e a captura joga fora as duas coisas. Um visualizador incorporado as mantém: o leitor pode orbitar, cortar, clicar num elemento e ler suas propriedades, em qualquer dispositivo, sem instalar nada.
Fazer isso custa um iframe. Fazer bem exige conhecer quatro parâmetros e uma regra de segurança do navegador.
O embed mínimo
<iframe
src="https://www.ifcvieweronline.eu/?model=https://your-host.com/model.ifc&embed=1"
width="100%" height="600"
style="border:0;border-radius:12px;max-width:100%"
loading="lazy" allow="fullscreen"
title="3D IFC model">
</iframe>
O navegador do visitante baixa o IFC direto do seu servidor e o processa localmente. O modelo nunca é enviado para nós, o que costuma ser a primeira pergunta de quem assinou um NDA — e uma diferença real em relação a embeds que exigem enviar o modelo antes para a nuvem de um fornecedor.
Monte seu embed
Cole uma URL pública de IFC, escolha um modo e copie o iframe. A pré-visualização atualiza ao vivo.
Abrir o IFC Viewer
Os parâmetros que vale conhecer
| Parâmetro | O que faz | Use para |
|---|
| model | Carrega uma ou mais URLs de IFC (separadas por vírgula para um conjunto federado) | Tudo |
| ui | Modo de interface: minimal, full, kiosk ou client | Adequar ao público |
| validate | Executa a validação ao carregar e mostra o Health Score | Mostrar qualidade, não só geometria |
| isolate / select | Abre com uma classe IFC isolada ou um elemento selecionado | Apontar para aquilo sobre o que você está escrevendo |
| accent | Tinge o visualizador com uma cor hexadecimal | Dashboards e páginas com marca |
| lang | Força o idioma da interface | Sites localizados |
| map | Posiciona o modelo no mapa base a partir da georreferência | Contexto do terreno em propostas |
A referência completa, incluindo estudos solares e nuvens de pontos, está na documentação de embeds.O modo ui é o que mais importa. minimal é o certo para posts de blog e documentação. kiosk remove tudo para telas num saguão ou num stand de vendas. client foi pensado para enviar ao proprietário: uma vista limpa e um selo de qualidade, sem as ferramentas de que um coordenador precisa e um cliente não.
Onde funciona
- Sites e blogs — qualquer CMS que aceite HTML: WordPress, Webflow, Ghost, um site estático.
- Power BI — um visual de conteúdo web ou de visualizador HTML, com accent no tema do relatório. Um modelo ao lado dos gráficos de custo e cronograma que ele explica.
- Notion, Confluence, SharePoint — cole a URL como bloco incorporado.
- Painéis de CDE e ferramentas internas — um iframe, com eventos de ciclo de vida enviados à janela pai para que a plataforma reaja quando o modelo estiver pronto ou validado.
- Propostas e licitações — como link, se o formato não aceitar embeds. Um link para um modelo vivo numa proposta ainda é raro o bastante para ser notado.
Por que não carrega: CORS e mais duas causas
O modelo vai do seu armazenamento ao navegador do visitante. Sem cabeçalho CORS no servidor, o navegador se recusa a entregá-lo.
- Links de compartilhamento que devolvem uma página web, não o arquivo. Links do Dropbox, OneDrive e Google Drive costumam abrir uma página de pré-visualização; você precisa da forma de download direto do link.
- Links que exigem login. O navegador do visitante não tem sessão no seu CDE, então um link privado devolve uma página de login.
- Arquivos muito grandes em servidores lentos. O modelo é baixado inteiro antes de ser processado; hospede conjuntos federados grandes num lugar rápido e considere dividi-los.
Se os modelos forem grandes demais para incorporar com conforto, como reduzir o tamanho de um arquivo IFC cobre as reduções seguras.
Quando um iframe não basta: o SDK
Um iframe mostra um modelo. Assim que sua página precisa conversar com ele — destacar um elemento quando uma linha da sua tabela é clicada, levar o Health Score para o seu dashboard, executar uma especificação IDS e listar as falhas na sua própria interface, iniciar um tour guiado —, você quer o SDK. Ele envolve o mesmo visualizador com uma API tipada e bidirecional, disponível como script ou como web component <ifc-viewer>.
Se, em vez disso, você quiser construir seu próprio visualizador a partir das bibliotecas de base, visualizar IFC na web com three.js e Fragments mostra o que isso envolve — e por que a maioria das equipes que começa por aí acaba incorporando.
Em projetos confidenciais, a mesma arquitetura no cliente que faz os embeds funcionarem é a que mantém o modelo fora de servidores de terceiros; os detalhes estão em visualizadores IFC para projetos confidenciais e com NDA.
Como incorporar um visualizador IFC num site, num CDE ou num relatório do Power BI