Extension de navigateur pour permettre à l'interface de chat officielle de DeepSeek de prendre en charge les graphiques de rendu en ligne

Introduction générale

DeepSeek Diagrams Extension est une extension Chrome conçue pour aider les utilisateurs à rendre les diagrammes en ligne sur le site web DeepSeek. Basée sur la bibliothèque Mermaid.js, l'extension convertit les diagrammes décrits dans le texte directement en diagrammes visuels, améliorant ainsi l'expérience de l'utilisateur sur DeepSeek. Grâce à cette extension, les utilisateurs peuvent facilement créer et visualiser des organigrammes, des diagrammes de séquence, des diagrammes de Gantt et d'autres types de diagrammes, ce qui facilite grandement la visualisation et l'analyse des données.

Liste des fonctions

• Rendu graphiqueLes sites DeepSeek peuvent afficher en ligne de nombreux types de diagrammes, notamment des organigrammes, des diagrammes de séquence, des diagrammes de Gantt, etc.
• Intégration de Mermaid.jsBasé sur la bibliothèque Mermaid.js, il permet de créer des graphiques à l'aide de la syntaxe Mermaid.
• Installation rapideLes utilisateurs peuvent ainsi être rapidement opérationnels grâce à un processus d'installation simple.
• Aperçu en temps réelLes résultats des graphiques peuvent être visualisés en temps réel sur le site Web de DeepSeek.
• haute compatibilitéCompatible avec la dernière version de Chrome pour garantir un fonctionnement stable.

Utiliser l'aide

Processus d'installation

1) Aller sur https://github.com/yan5xu/deepseek-diagrams-extension/releases

2. télécharger le dernier paquet zip

3) Ouvrez la page de gestion des extensions Chrome et tapez chrome://extensions/ dans la barre d'adresse).

4) Activez le "Mode développeur" dans le coin supérieur droit.

5) Cliquez sur "Load Extracted Extensions" et sélectionnez le dossier . /dist du projet. (Faites glisser le fichier zip téléchargé dans le dossier et il fonctionnera).

Utilisation

1. Une fois l'installation terminée, visitez le site Web de DeepSeek.
2. Lorsque les graphiques doivent être rendus, utilisez la syntaxe Mermaid pour écrire les descriptions des graphiques. Exemple :

   sequenceDiagram
Alice->>Bob: Hello Bob, how are you?
Bob-->>Alice: I am good thanks!

3. Une fois la description du graphique terminée, cliquez sur le bouton "Rendre le graphique" et le graphique sera automatiquement généré et intégré à la page.
4. Les utilisateurs peuvent prévisualiser les résultats des graphiques en temps réel en ajustant la syntaxe de Mermaid jusqu'à ce qu'ils soient satisfaits.

Principales fonctions

• Création d'organigrammesPour générer l'organigramme, saisissez la description syntaxique Mermaid de l'organigramme dans la zone de texte du site Web DeepSeek et cliquez sur le bouton "Rendre le diagramme".
• Création de diagrammes de séquenceLe diagramme de séquence peut être généré en cliquant sur le bouton "Rendre le diagramme", puis en saisissant la description syntaxique Mermaid du diagramme de séquence dans la zone de texte.
• Création d'un diagramme de GanttLe diagramme de Gantt peut être généré en saisissant la description syntaxique Mermaid du diagramme de Gantt et en cliquant sur le bouton "Render Chart" (Rendre le diagramme).

Exemple de fonctionnement détaillé

1. Exemple d'organigramme: :

   graph TD
A[Start] --> B{Is it?}
B -->|Yes| C[OK]
B -->|No| D[Not OK]

Après avoir saisi le code ci-dessus, cliquez sur le bouton "Rendre le diagramme" pour générer l'organigramme.

2. Exemple de diagramme de séquence: :

   sequenceDiagram
participant Alice
participant Bob
Alice->>Bob: Hello Bob, how are you?
Bob-->>Alice: I am good thanks!

Après avoir saisi le code ci-dessus, cliquez sur le bouton "Render Chart" pour générer le diagramme de séquence.

3. Exemple de diagramme de Gantt: :

   gantt
dateFormat  YYYY-MM-DD
title Adding GANTT diagram to mermaid
section A section
Completed task            :done,    des1, 2014-01-06,2014-01-08
Active task               :active,  des2, 2014-01-09, 3d
Future task               :         des3, after des2, 5d

Après avoir saisi le code ci-dessus, cliquez sur le bouton "Render Chart" pour générer un diagramme de Gantt.

Avec les étapes ci-dessus, les utilisateurs peuvent facilement créer et rendre différents graphiques dans le site Web DeepSeek pour améliorer la visualisation des données.