实习生漂流记之recharts and git

今天很糟糕，但收获颇多

主要出现了两个问题，一个是数据可视化的UI组件库选择问题，一开始让我用recharts设计数据视图，由于开发经验无，眼界比较狭窄，只知道echarts，所以使用recharts举步维艰，简直走不动，视频教学也找不到，只能选择看文档；第二个问题就是，在GitLab上给我开通了一个账户，并且创建了一个空仓，让我把之前本地写好的代码提交到该仓库，在此之前呢，我把本地写的代码提交到了Gitee上了，这一下不会操作了，按照gitlab的提示进行推送，遇到的是仓库的顽强抵抗，详细往下看：

recharts的简单用法及及案例

代码：

import "./styles.css";
import React from "react";
import {
  BarChart,
  Bar,
  XAxis,
  YAxis,
  CartesianGrid,
  Tooltip,
  Legend
} from "recharts";

const data = [
  {
    name: "0~60",
    pv: 80
  },
  {
    name: "60~100",
    pv: 220
  },
  {
    name: "100~120",
    pv: 300
  },
  {
    name: "120~150",
    pv: 170
  },
  {
    name: "150+",
    pv: 90
  }
];

export default function App() {
  return (
    <BarChart
      // 图标的样式及数据
      width={380}
      height={300}
      data={data}
      margin={{
        top: 5,
        right: 25,
        left: -15,
        bottom: 5
      }}
      barSize={25} //柱状图的大小
    >
      <XAxis
        dataKey="name" //指定轴展示的数据
        name="lei"
        type="category" //轴的类型 number or category
        scale="point"
        // hide={true} //bu显示X轴
        // tick={false} // 显示轴单不绘制刻度
        width={50}
        orientation="bottom" //X轴的位置
        angle={20} //轴刻度的旋转角度
        tickLine={false} // 隐藏轴的刻度线
        padding={{ left: 25 }} //指定内边距(只有left、right) 设置图的位置
        tickCount={2}
      />
      <YAxis
        ticks={["100", "200", "300"]} //自定义刻度值
      />
      {/* 鼠标触碰提示框信息 */}
      <Tooltip />
      {/* 图例 */}
      <Legend
        verticalAlign="top"
        height={36}
        layout="horizontal" //布局horizontal-横向、vertical-纵向
        align="right" //水平方向的对齐方式
        iconSize={15} // 图例图标的大小
        iconType="rect" //图标类型 square-正方形、circle-圆
      />
      {/* 网格线 */}
      <CartesianGrid strokeDasharray="3 3" />
      <Bar dataKey="pv" fill="#8884d8" />
    </BarChart>
  );
}
recharts效果图：

git 将本地代码提交到新的开源平台

首先在新的开源平台创建一个新的仓库，我现在的情况就是：本地开发的一个项目，并且已经提交到Gitee(码云)，比如现在公司喜欢使用gitHub，为了方便检查我的进度，以及查看代码，新建一个项目让我把本地代码提交上去，开始操作：
切换到本地项目所在目录

cd Cockpit

按照GitHub提供的git命令，如下图所示：

在这里我选则第二种，使用git命令，自找苦吃，当然也可以选择简单的操作，比如导入代码、或者把GitHub新建仓库clone到本地，然后把本地代码copy进去再提交就可以了，接着说使用git的操作，执行推送命令：

git remote add origin https://github.com/Fightingllc/Cockpit.git

报错喽，错误原因就是要推送的新仓库存在origin分支，我们需要把该分支删除或者重命名才能继续推送，报错图及解决命令如下：

命令：

git remote rm origin
git remote add origin https://github.com/Fightingllc/Cockpit.git
git push
 git push --set-upstream origin master

然后可能需要验证Github账户密码，continue就行，连接后，再次执行 git push --set-upstream origin master命令，又报错喽，如图所示：

然后新建一个分支，但是又报错了：

不要慌，查看一下分支，git branch -a 或者 git fetch，效果如下：

不要慌，一下解决它：

git checkout -b dev
git push
git push --set-upstream origin dev

成了

一天的实习又以点滴的知识总结结束了，明天见。