利用html与echarts进行展示可视化学校迎新数据大屏展示学生报道地区以折线图展示学生报到学院以柱形图展示学生的男女比例以饼图展示学生的民族以飞机航线图展示均要求包含标题副标题图例工具栏

下面是一个使用HTML和ECharts进行学校迎新数据大屏展示的示例：

<!DOCTYPE html>
<html>
<head>
  <title>学校迎新数据大屏展示</title>
  <meta charset="utf-8">
  <script src="https://cdn.staticfile.org/echarts/4.7.0/echarts.min.js"></script>
</head>
<body>
  <div id="studentLocation" style="width: 800px; height: 400px;"></div>
  <div id="studentCollege" style="width: 800px; height: 400px;"></div>
  <div id="studentGender" style="width: 800px; height: 400px;"></div>
  <div id="studentEthnicity" style="width: 800px; height: 400px;"></div>

  <script type="text/javascript">
    // 报到地区折线图
    var locationChart = echarts.init(document.getElementById('studentLocation'));
    var locationOption = {
      title: {
        text: '学生报道地区',
        subtext: '2021年度'
      },
      tooltip: {},
      legend: {
        data: ['学生数量']
      },
      xAxis: {
        data: ['地区A', '地区B', '地区C', '地区D', '地区E']
      },
      yAxis: {},
      series: [{
        name: '学生数量',
        type: 'line',
        data: [120, 200, 150, 80, 70]
      }]
    };
    locationChart.setOption(locationOption);

    // 报到学院柱形图
    var collegeChart = echarts.init(document.getElementById('studentCollege'));
    var collegeOption = {
      title: {
        text: '学生报到学院',
        subtext: '2021年度'
      },
      tooltip: {},
      legend: {
        data: ['学生数量']
      },
      xAxis: {
        data: ['学院A', '学院B', '学院C', '学院D', '学院E']
      },
      yAxis: {},
      series: [{
        name: '学生数量',
        type: 'bar',
        data: [150, 100, 120, 90, 80]
      }]
    };
    collegeChart.setOption(collegeOption);

    // 学生男女比例饼图
    var genderChart = echarts.init(document.getElementById('studentGender'));
    var genderOption = {
      title: {
        text: '学生男女比例',
        subtext: '2021年度'
      },
      tooltip: {},
      legend: {
        data: ['男', '女']
      },
      series: [{
        name: '学生性别',
        type: 'pie',
        radius: '50%',
        data: [
          {value: 60, name: '男'},
          {value: 40, name: '女'}
        ]
      }]
    };
    genderChart.setOption(genderOption);

    // 学生民族飞机航线图
    var ethnicityChart = echarts.init(document.getElementById('studentEthnicity'));
    var ethnicityOption = {
      title: {
        text: '学生民族',
        subtext: '2021年度'
      },
      legend: {
        data: ['学生数量']
      },
      geo: {
        map: 'china',
        roam: true
      },
      series: [{
        name: '学生数量',
        type: 'lines',
        coordinateSystem: 'geo',
        data: [
          {fromName: '北京', toName: '新疆', value: 50},
          {fromName: '上海', toName: '新疆', value: 30},
          {fromName: '广州', toName: '新疆', value: 20},
          {fromName: '深圳', toName: '新疆', value: 10},
          {fromName: '成都', toName: '新疆', value: 5}
        ]
      }]
    };
    ethnicityChart.setOption(ethnicityOption);
  </script>
</body>
</html>

以上代码中，我们通过使用ECharts库来创建折线图、柱形图、饼图和飞机航线图，然后使用HTML布局来放置这些图表。每个图表都有一个独立的div元素来容纳，通过echarts.init方法来初始化图表对象，并通过setOption方法设置图表的配置项和数据。

每个图表都有一个标题和副标题，可以根据实际需求进行修改。图例用于显示图表中不同系列的标识，工具栏可以通过ECharts的配置项来启用。

利用html与echarts进行展示可视化学校迎新数据大屏展示学生报道地区以折线图展示学生报到学院以柱形图展示学生的男女比例以饼图展示学生的民族以飞机航线图展示均要求包含标题副标题图例工具栏