From c927433bced76026796e7c80bce61a1d4bc20128 Mon Sep 17 00:00:00 2001 From: yunji Date: Wed, 13 Nov 2024 17:31:18 +0800 Subject: [PATCH] docs: readme --- README.md | 83 ++++++++++++++++++++++--------------------------- README.zh-CN.md | 69 ++++++++++++++++++++++++++++++++++++++++ 2 files changed, 106 insertions(+), 46 deletions(-) create mode 100644 README.zh-CN.md diff --git a/README.md b/README.md index bf84562..d593f71 100644 --- a/README.md +++ b/README.md @@ -1,78 +1,69 @@ -

-GPT-VIS -

+ [English](./README.md) | 简体中文 + +

GPT-Vis

+ Components for GPTs, generative AI, and LLM projects. Not only UI Components. -![GPT-vis logo-06](https://github.com/eosphoros-ai/GPT-Vis/assets/17919400/c8804ffb-d3d6-45d3-846f-cf217681ab05) +

+ Document • + Knowledge • + Huggingface • + Agent Demo +

+
+
-## 特性 +
-- 🤖 **LLM 相关**：针对 LLM 对话式交互，以及服务端序列化输出而设计，方便快速集成到 AI 应用中。 -- 🍡 **丰富组件**：内置有 20+ 美观好看的常用 UI 组件，满足常规需求。 -- 🔨 **易于扩展**：对于自己的特殊 UI 定制需求，提供方便的扩展机制和架构设计。 +## ✨ Features -## 安装 +- 🤖 **LLM Protocol**: A visual protocol for LLM Agent cards, designed for LLM conversational interaction and service serialized output, to facilitate rapid integration into AI applications. +- 🍡 **LLM Component**: Developed components for LLM applications, with 20+ commonly used VIS components built-in, providing convenient expansion mechanism and architecture design for customized UI requirements. +- 📈 **LLM access**: Chart knowledge base and chart recommendation model for seamless access to LLM, directly output visual cards for LLM, and provide knowledge base and recommended model solutions for Agent. -使用 NodeJS 包管理工具安装依赖。 +## 📦 Installation ```bash -$npm i --save gpt-vis +$ npm add @antv/gpt-vis --save ``` -## 快速使用 - -快速使用 gpt-vis 渲染出对话卡片的 UI。 +## 🔨 Usage -```tsx -import { Conversation, Components } from "gpt-vis"; +```jsx +import { GPTVis } from '@antv/gpt-vis'; -function Demo() { - // 服务端返回的协议内容 - const content = - "# GPT-VIS \n\nComponents for GPTs, generative AI, and LLM projects. Not only UI Components."; +const markdownContent = ` +# GPT-VIS \n\nComponents for GPTs, generative AI, and LLM projects. Not only UI Components. - return {content}; -} -``` - -使用自定义的 UI 组件。UI 渲染最终使用 markdown 格式，所以自定义的方式有两种，一种是基于 markdown code 标签去扩展语言，一种是扩展标签。 +Here’s a visualization of Haidilao's food delivery revenue from 2013 to 2022. You can see a steady increase over the years, with notable *growth* particularly in recent years. -````tsx -import { Conversation, Components } from "gpt-vis"; +\`\`\`vis-chart +{ "type": "line","data": [{"time":2013,"value":59.3},{"time":2014,"value":64.4},{"time":2015,"value":68.9},{"time":2016,"value":74.4},{"time":2017,"value":82.7},{"time":2018,"value":91.9},{"time":2019,"value":99.1},{"time":2020,"value":101.6},{"time":2021,"value":114.4},{"time":2022,"value":121}] } +\`\`\` +`; -const custom = { - "my-ui": () => {}, +export default () => { + return {markdownContent}; }; +``` -function Demo() { - // 服务端返回的协议内容 - const content = '# GPT-VIS \n\n```my-ui\n{"value": "1"}```'; - - return ( - - {content} - - ); -} -```` - -## Development +## 💻 Development ```bash # install dependencies -$ npm install +$ pnpm install # develop library by docs demo -$ npm run dev +$ pnpm dev # build library source code -$ npm run build +$ pnpm build ``` ## License -MIT +[MIT](./LICENSE) diff --git a/README.zh-CN.md b/README.zh-CN.md new file mode 100644 index 0000000..b76ce47 --- /dev/null +++ b/README.zh-CN.md @@ -0,0 +1,69 @@ + [English](./README.md) | 简体中文 + +

GPT-Vis

+ +
+ +Components for GPTs, generative AI, and LLM projects. Not only UI Components. + +

+ 文档 • + 知识库 • + Huggingface • + 体验 Agent +

+ +
+ +
+ +
+ +## 特性 + +- 🤖 **LLM 协议**：面向 LLM Agent 卡片的可视化协议，针对 LLM 对话式交互，以及服务序列化输出而设计，方便快速集成到 AI 应用中。 +- 🍡 **LLM 组件**：面向 LLM 应用研发组件, 内置有 20+ 常用 VIS 组件，对于定制 UI 需求，提供方便的扩展机制和架构设计。 +- 📈 **LLM 接入**：面向 LLM 无缝接入的图表知识库和图表推荐模型，针对 LLM 直接输出可视化卡片，为 Agent 提供知识库以及推荐模型方案。 + +## 📦 安装 + +```bash +$ npm add @antv/gpt-vis --save +``` + +## 🔨 使用 + +```jsx +import { GPTVis } from '@antv/gpt-vis'; + +const markdownContent = ` +# GPT-VIS \n\nComponents for GPTs, generative AI, and LLM projects. Not only UI Components. + +Here’s a visualization of Haidilao's food delivery revenue from 2013 to 2022. You can see a steady increase over the years, with notable *growth* particularly in recent years. + +\`\`\`vis-chart +{ "type": "line","data": [{"time":2013,"value":59.3},{"time":2014,"value":64.4},{"time":2015,"value":68.9},{"time":2016,"value":74.4},{"time":2017,"value":82.7},{"time":2018,"value":91.9},{"time":2019,"value":99.1},{"time":2020,"value":101.6},{"time":2021,"value":114.4},{"time":2022,"value":121}] } +\`\`\` +`; + +export default () => { + return {markdownContent}; +}; +``` + +## 💻 本地开发 + +```bash +# install dependencies +$ pnpm install + +# develop library by docs demo +$ pnpm dev + +# build library source code +$ pnpm build +``` + +## License + +[MIT](./LICENSE)