delon-chart
Criar Gráficos Angular com G2Plot
Criar gráficos empresariais em Angular requer compreensão das APIs do G2Plot e padrões do ng-alain. Esta skill fornece padrões de componentes prontos para uso para gráficos de barras, pizza, radar e linha do tempo usando @delon/chart.
下載技能 ZIP
在 Claude 中上傳
前往 設定 → 功能 → 技能 → 上傳技能
開啟並開始使用
測試它
正在使用「delon-chart」。 Mostre-me como criar um gráfico de barras
預期結果:
- Importe G2BarComponent de @delon/chart/bar
- Defina dados como um signal com propriedades x e y
- Configure as props de altura e espaçamento no componente
- Use computed signals para atualizações de dados reativas
- Exemplo: <g2-bar [data]="barData()" [height]="300" [padding]="[20, 40, 50, 40]" />
正在使用「delon-chart」。 Como criar um gráfico de pizza com opção de rosca
預期結果:
- Importe G2PieComponent de @delon/chart/pie
- Configure a prop [inner] com um valor entre 0 e 1
- Use a prop [hasLegend] para exibir a legenda
- Configure a prop [total] para exibição do total no centro
- Exemplo: <g2-pie [data]="data()" [inner]="0.6" [hasLegend]="true" [total]="totalTasks()" />
安全審計
安全Pure documentation skill containing only markdown content and TypeScript code examples. No executable code, scripts, network calls, or file system access. All 61 static findings are false positives caused by the scanner misinterpreting documentation patterns as security threats.
風險因素
🌐 網路存取 (3)
📁 檔案系統存取 (1)
⚙️ 外部命令 (47)
品質評分
你能建構什麼
Construir visualizações de painel
Criar painéis de dados com múltiplos tipos de gráficos para inteligência de negócios
Adicionar gráficos a interfaces administrativas
Integrar gráficos empresariais em painéis administrativos usando padrões de componentes
Visualizar progresso de tarefas
Exibir detalhamentos de status de tarefas e métricas de crescimento com gráficos interativos
試試這些提示
Mostre-me como criar um gráfico de barras com @delon/chart usando signals do Angular
Como criar um gráfico de pizza com legenda e opção de rosca usando @delon/chart
Crie um exemplo de painel com componentes chart-card, gráfico de barras e gráfico de pizza
Quais são as melhores práticas para otimizar o desempenho de gráficos e lidar com grandes conjuntos de dados
最佳實務
- Use computed signals para dados de gráfico reativos em vez de mutações diretas
- Transforme dados fora dos templates usando computed() para melhor desempenho
- Trate estados de carregamento e vazios com blocos @if para melhor experiência do usuário
避免
- Mutar dados de gráfico diretamente sem usar signals - use o método .update() em vez disso
- Colocar lógica de filtragem complexa em bindings de template - use computed signals em vez disso
- Buscar dados novamente a cada ciclo de detecção de mudanças - memoize com computed signals