人工智能思维导图：神经多样性学习者的一种可访问方法

了解如何构建自己的人工智能生成思维导图，以支持神经多样性读者和学习者。

在本文中，我将介绍VisuaLearner Mermaid AI，这是一个使用Cohere和OpenAI技术使用Databutton构建和部署的视觉辅助应用程序。我将为您提供代码片段和解释，帮助您遵循并构建自己的美人鱼人工智能应用程序。
请尝试此处的应用程序演示！
 

VisualLearner：用户之旅

Generated using AI and Mermaid.js

介绍

读者们，大家好！这篇博客文章是我在人工智能和数据科学学徒期间开始的一次发现和创新之旅。就在那时，我发现自己患有多动症（注意力缺陷/多动障碍），这一发现带来了理解和缓解。这不是一次挫折，而是一次机会，让我了解自己独特的学习需求，并将其作为寻找有效解决方案的垫脚石。

我发现的一个这样的解决方案是可视化，特别是通过思维导图和流程图。这种视觉学习方法改变了我和无数其他人的游戏规则，因为研究表明，大约65%的人是视觉学习者​1.​​2.​​3.​. 有了这些知识，我开始构建一个工具，将这些视觉辅助工具与人工智能相结合，以增强学习过程。

这种视觉学习方法改变了我和无数其他人的游戏规则，因为研究表明，大约65%的人是视觉学习者。

旅程

在我的学徒生涯中，我面临着一些挑战，比如保持对视频通话、日记活动和阅读研究论文的关注。我感到不知所措，开始质疑自己的能力。然而，在得知这些挣扎是多动症的症状后，这种疾病影响了美国600多万儿童和相当多的成年人​4.​​5.​, 我意识到我的大脑只是以不同的方式处理信息。并不是我不能学习；我只需要以不同的方式学习。

解决方案

我开始在工作空间中使用一块大白板，在那里我可以创建思维导图和流程图，将复杂的信息分解为视觉上易于消化的块。这尤其有益，因为多动症与视觉感知的改变有关​6.​​7.​​8.​. 通过这些视觉辅助工具，我能够更有效地理解和保留信息，与他人分享我的工作，并为我的学习之旅提供参考。

想法

在我亲身经历的启发下，我意识到人工智能语言模型可以理解复杂的信息并生成代码。我想知道：我能用人工智能自动生成思维导图和流程图吗？我很想知道。

计划

在这篇博客文章中，我很高兴向您介绍我构建的一个应用程序，该应用程序利用人工智能的力量将大量信息提炼成视觉格式。通过演示和代码片段，我将带您了解该应用程序如何支持神经多样性学习者，提高学习效率和有效性。这个应用程序不仅是我在人工智能和数据科学方面训练的产物，也是我个人多动症之旅的产物。我希望这个工具能帮助其他像我一样有独特学习需求和优势的人。

敬请关注，发现一种不同的学习方式，一种庆祝神经多样性并利用它创造真正赋权的方式。

让我们投入进去！

如何构建应用程序

此应用程序是使用Databutton构建和部署的。Databutton是一个人工智能驱动的工作空间，旨在促进数据应用程序的创建和共享。它允许用户直接从浏览器中利用整个Python生态系统来构建和分发人工智能和数据应用程序。其用户友好的设计使其易于将想法转化为功能应用程序，使其成为初学者和专业人士的高效工具​​.

在应用程序开发过程中，Databutton是管理我的多动症的一个有用工具：

• 结构化工作流程：其有序的用户界面减少了干扰，增强了注意力。
• 快速原型：快速部署可以保持势头，减少利息损失。
• 视觉界面：帮助视觉学习者掌握复杂的概念，这在多动症中很常见。
• 无障碍学习：直观的设计和清晰的文档简化了技能获取。
• 互动体验：参与、动手的方法可以增强兴趣和动力。
• 轻松协作：促进团队合作和反馈，缓解孤独感。

从本质上讲，Databutton的功能解决了多动症的挑战，使应用程序开发更具吸引力和生产力。

只需点击几下，我就可以将我的应用程序部署到世界各地！

添加代码

1.导入必要的模块：

应用程序首先导入必要的Python模块：requests、BeautifulSoup、databutton、openai、cohere和streamlight。

import databutton as db
import requests
from bs4 import BeautifulSoup
import openai
import cohere
import streamlit as st

2.从网页上抓取文本：

scrape_text函数向提供的URL发送GET请求，并使用BeautifulSoup检索网页的文本内容。如果GET请求成功，则返回文本，否则返回失败消息。

def mermaid_chart(mindmap_code):
   html_code = f"""
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
   <div class="mermaid">{mindmap_code}</div>
   <script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
   <script>mermaid.initialize({{startOnLoad:true}});</script>
   """
   return html_code

3.创建Mermaid.js图表：

Merro_chart函数为mermaid.js图生成HTML。此函数以Mermaid.js代码（表示思维导图）作为输入，并返回可用于显示思维导图的HTML代码。

mindmap
 root(Cofinder)  
   (Introduction)  
     ::icon(fa fa-info-circle)  
     (Designed to help the Cohere Community find relevant content)  
     (Users can ask natural language questions)  
     (Semantic search tool that brings together information from multiple sources)  
   (Repository Contents)  
     ::icon(fa fa-folder-open)  
     (cohere_text_preprocessing.csv)  
     (preprocessing.ipynb)  
     (main.py)  
     (cohere_text_final.csv)  
     (search_index.ann)  
   (Five Steps to Building the Application)  
     ::icon(fa fa-list-ol)  
     (Data Sources)  
       (Pre-processing the article text into chunks)  
     (Embeddings & Search Index)  
       (Use co.embed to obtain a vector representation of data)  
       (Store embeddings in a vector database)  
     (Front End)  
       (Streamlit for user interaction)  
     (Search)  
       (Use co.embed to get vector representation of user query)  
       (Use nearest neighbours to return relevant content)  
     (Answer)  
       (Use co.generate to answer the query given the 
       context from the search results and the question)  
   (Streamlit Application)  
     ::icon(fa fa-desktop)  
     (Load libraries, data and search index)  
     (Add functions to generate embeddings to search the Annoy 
     index for the user’s query)  
     (Generate an answer from the context)  
     (Add Streamlit search input and button to run functions)

4.设置OpenAI API：

然后，应用程序通过指定API类型、基本URL、版本和密钥来设置OpenAI API。

def run_models(input_text):
   # Note: content is hidden due to length of text, you can add user and assistant roles
   response = openai.ChatCompletion.create(
       engine="GPT35turbo",
       messages=[
           {
               "role": "system",
               "content": "You are generating a mindmap for someone who has ADHD...",
           },
           {"role": "user", "content": input_text},
       ],
       temperature=0.2,
       max_tokens=400,
       top_p=0.95,
       frequency_penalty=0,
       presence_penalty=0,
       stop=None,
   )
   return response

5.运行GPT-3模型：

run_models函数使用OpenAI的GPT-3模型创建一个完成。它将抓取的文本作为输入，并以Mermaid.js代码的形式生成思维导图。

6.总结文本：

summary函数使用Cohere summary API生成输入文本的摘要。以下是此函数的代码：

def summarise(input_text):
   co = cohere.Client(
       db.secrets.get("COHERE_API_KEY")
   )
   response = co.summarize(
       text=input_text,
       length="long",
       format="paragraph",
       model="summarize-xlarge",
       additional_command="What are th

7.使用数据按钮构建UI：

该应用程序使用Databutton创建用户界面（UI），用户可以在其中输入URL。然后，该应用程序从该URL处的网页中抓取文本，生成摘要，为思维导图生成Mermaid.js代码，并显示思维导图。

import databutton as db
import streamlit as st
from streamlit.components.v1 import html
from utils import scrape_text, mermaid_chart, run_models, summarise
# UI
st.title("AI Generated Mermaid.js Mindmap")
# Creating a form for both caching and clean input box on run
form = st.form("Form to run", clear_on_submit=True)
url = form.text_input("Enter your URL below:", 
placeholder="Paste any URL of your choice")
if form.form_submit_button("Generate Mermaid Mindmap Visual"):
   text = scrape_text(url)
   input_text = "Generate a Mermaid.js mindmap only using
    the text below:\n" + text
   with st.expander("See full article"):
       st.write(text)
   with st.spinner("Generating Cohere AI Summary "):
       summary = summarise(text)
       st.write("### Cohere AI Generated Summary")
       st.write(summary)
   with st.spinner("Generating Mermaid Code"):
       out = run_models(input_text)
   mindmap_code = out["choices"][0]["message"]["content"][10:-3]
   with st.expander("See OpenAI Generated Mermaid Code"):
       st.code(mindmap_code)
   # Use the html function to display the Mermaid.js diagram
   html(mermaid_chart(mindmap_code), width=1500, height=1500)

8.用户输入：

用户以Streamlight UI中提供的形式输入URL。提交URL后，应用程序从网页中抓取文本，使用Cohere API生成摘要，并使用OpenAI的GPT-3模型生成Mermaid.js mindmap。然后在UI中显示摘要和思维导图。

结论

总之，通过VisuaLearner Mermaid AI和Databutton利用人工智能生成的思维导图和视觉辅助，为神经多样性读者和学习者提供了一种可访问的支持方法。

通过从网站上抓取文本、生成摘要和创建思维导图，患有多动症和其他神经多样性疾病的人可以增强他们的学习体验。人工智能和视觉工具的结合有助于克服不知所措的感觉，并促进更好的理解。

其目标是庆祝神经多样性，提高对多动症的认识，并提供包容性的学习解决方案。将应用程序扩展到包含各种文本源和可视化，将进一步丰富神经多样性个体的学习过程，使学习更具吸引力和有效性。

拥抱技术和同理心能够为有不同学习需求的个人创造一个包容性的学习环境。