做时间轴图表并不难，但是很麻烦，先要大量收集相关事件，然后在一些图表软件中反复调整操作。现在借助AI工具，可以自动生成了。
首先，在kimi中输入提示词来获取某个企业的大事记：
联网检索，元语智能chatYuan这个公司的大事记
以下是kimi的回复：
根据搜索结果，元语智能ChatYuan的大事记如下：
2022年10月1日，元语智能发布了PromptCLUE1.0模型和API，这是首个中文支持的零样本开源模型。
2022年11月，发布了PromptCLUE1.5模型和API，这个版本支持更多任务的零样本开源模型。
2022年12月20日，元语智能发布了ChatYuan，这是国内首个基于百亿参数大模型的功能对话产品，支持小程序和网页。
2023年1月12日，元语智能发布了ChatYuan大模型，这是首个功能对话开源模型供免费下载，全平台已有数万下载量。
2023年2月3日，元语智能发布了ChatYuan API，可供API调用的功能对话模型。
2023年2月22日，元语智能对ChatYuan进行了升级，支持中英双语交互、多次编辑、上下文关联交互、模拟情景设定等多种新功能。
可以看到是比较完整的，然后可以根据企业微信公众号等渠道再稍微添加一些事件，就很完整了。
接下来，将以上大事记复制到claude中，然后加上一段提示词：根据以上内容，用react创建一个竖向的时间轴图表，要紧凑一些，不用滚动下拉即可在一屏中看见，字体加粗，要有设计感一些，时间要显示成年月日，标题是：元语智能大事记
claude很快生成图表：
还可以查看源代码：
import React from 'react';
import { Card, CardContent } from '@/components/ui/card';
const timelineData = [
{ date: '2022-10-01', event: 'PromptCLUE1.0模型' },
{ date: '2022-11-01', event: 'PromptCLUE1.5模型' },
{ date: '2022-12-20', event: 'ChatYuan发布' },
{ date: '2023-01-12', event: 'ChatYuan大模型开源' },
{ date: '2023-02-03', event: 'API发布' },
{ date: '2023-02-09', event: '小程序打不开' },
{ date: '2023-02-22', event: 'ChatYuan升级' },
{ date: '2023-03-24', event: '支持手机' },
{ date: '2023-03-30', event: '入选AIGC50' },
{ date: '2023-04-03', event: '与外研在线合作' },
{ date: '2023-04-18', event: '升级版本发布' },
{ date: '2023-04-21', event: 'KnowX1.0发布' },
{ date: '2023-04-27', event: '入选AI创新企业TOP20' },
{ date: '2023-08-28', event: '公众号最后更新' },
];
const TimelineItem = ({ date, event, isLast }) => (
<div className="flex items-start mb-3 relative">
<div className="flex flex-col items-center mr-4">
<div className="w-3 h-3 bg-blue-500 rounded-full z-10"></div>
{!isLast && <div className="w-0.5 h-full bg-blue-200 absolute top-3 left-1"></div>}
</div>
<div className="flex-1">
<p className="text-xs font-bold text-blue-600 mb-1">{date}</p>
<p className="text-sm font-semibold">{event}</p>
</div>
</div>
);
const VerticalTimeline = () => {
return (
<Card className="max-w-md mx-auto h-screen flex flex-col bg-gradient-to-b from-blue-50 to-white">
<CardContent className="p-6 flex-grow overflow-hidden">
<h2 className="text-2xl font-extrabold mb-4 text-center text-blue-800">元语智能大事记</h2>
<div className="overflow-y-auto h-full pr-2 space-y-1">
{timelineData.map((item, index) => (
<TimelineItem
key={index}
date={item.date}
event={item.event}
isLast={index === timelineData.length - 1}
/>
))}
</div>
</CardContent>
</Card>
);
};
export default VerticalTimeline;
