It's not difficult to make a timeline chart, but it's a hassle, you have to collect a lot of relevant events first, and then adjust the operation repeatedly in some charting software. Now with the help of AI tools, it can be generated automatically.
First, enter the prompt word in Kimi to get the memorabilia of a certain company:
Network search, the memorabilia of the company chatYuan
Here's Kimi's response:
According to the search results, the memorabilia of ChatYuan is as follows:
On October 1, 2022, Yuanyu released the PromptCLUE1.0 model and API, which is the first zero-shot open-source model supported by Chinese.
In November 2022, the PromptCLUE1.5 model and API were released, which supports zero-shot open-source models for more tasks.
On December 20, 2022, Yuanyu released ChatYuan, which is the first functional dialogue product in China based on a large model with tens of billions of parameters, supporting mini programs and web pages.
On January 12, 2023, Yuanyu released the ChatYuan model, which is the first functional dialogue open-source model for free download, and has tens of thousands of downloads on the whole platform.
On February 3, 2023, Metalanguage released the ChatYuan API, a functional dialogue model that can be called by the API.
On February 22, 2023, ChatYuan was upgraded to support a variety of new features such as bilingual interaction in Chinese and English, multiple editing, contextual interaction and simulated scenario setting.
It can be seen that it is relatively complete, and then you can add some events a little bit according to channels such as the WeChat official account of the enterprise, and it will be very complete.
Next, copy the above memorabilia into Claude, and then add a prompt: According to the above, use react to create a vertical timeline chart, which should be compact, and can be seen in one screen without scrolling and dropping, with a bold font, a sense of design, and a time to show adult months and days, and the title is: Metalanguage Intelligent Memorabilia
claude很快生成图表：
You can also check out the source code:
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"> Elemental Intelligence Memorabilia</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;