中国建设工程信息网官网入口厦门seo大佬

提示：本篇文章仅仅是作者自己目前在备赛蓝桥杯中，自己学习与刷题的学习笔记，写的不好，欢迎大家批评与建议

---

由于个别题目代码量与题目量偏大，请大家自己去蓝桥杯官网【连接高校和企业 - 蓝桥云课】去寻找原题，在这里只提供部分原题代码

本题目为：备赛蓝桥杯之第十六届模拟赛第1期职业院校组第四题：世纪危机（人口增长推算）

---

题目：

经过运行环境运行之后的效果如下：

本题需要做的代码如下：

/**人口数据增长推算函数* @param {number} initialPopulation 基础人口数，假设有 10 亿* @param {number} growthRate 年增长率，假设为 3%* @param {number} startYear 起始年份，假设为 200000*/
function calculatePopulation(initialPopulation, growthRate, startYear){const years = [];const population = [];// TODO：待补充代码 目标 1 return {years,population};
}// 配置 ECharts 选项
const option = {title: {text: '未来30年人口增长趋势图',subtext: '假设年增长率为3%',left: 'center'},tooltip: {trigger: 'axis',// TODO：待补充代码 目标 3 },xAxis: {type: 'category',// TODO：待修改代码 目标 2 // 年份data: ['2024','2025','2026','2027','2028','2029','2030','2031','2032'],name: '年份',boundaryGap: false},yAxis: {type: 'value',name: '人口数',axisLabel: {// TODO：待补充代码 目标 4}},series: [{name: '人口',type: 'line',// TODO：待修改代码 目标 2 // 人口数量data: [1000000000,1030000000,1040000000,1050000000,1070000000,1090000000,1094000000,1098000000,1130000000],smooth: true,lineStyle: {color: '#3398DB'},itemStyle: {color: '#3398DB'}}]
};

 本题目标如下：

请在 js/index.js 文件中的 TODO 部分补充代码实现需求，具体需求如下：

1. 完善 calculatePopulation 函数，实现从 200000 年开始的 30 年人口增长数据推算，并返回年份数组（years），如：[20000,200001,...]和人口数据（population）数组，如 [1030,1061,...]。该函数有三个参数，分别表示如下：

参数名	描述	数据类型
initialPopulation	基础人口数，假设有 10 亿（即，1000000000）	number
growthRate	年增长率，假设为 3%（即，0.03）	number
startYear	起始年份，假设为 200000	number

1. 把 calculatePopulation 函数生成的年份数据和人口数据分别正确赋值给 echarts 中的 x 轴数据和 y 轴数据。
2. 自定义 tooltip，每个 tooltip 显示当前年份和人口总数，人口总数需要通过四舍五入处理成万为单位（M）。自定义 tooltip 返回的 DOM 结构如下：

<p>2024<br/>人口：1000M</p>

1. 自定义 Y 轴属性 yAxis.axisLabel，该属性显示人口总数区间，人口总数需要通过四舍五入处理成万为单位（M）。

实现上述功能所需的 ECharts API 如下：

tooltip API：

参数	说明
formatter	提示框浮层内容格式器，支持回调函数的形式。回调函数格式：(params) => {}，支持返回 HTML 字符串或者创建的 DOM 实例，第一个参数 params 是 formatter 需要的数据集。

yAxis.axisLabel API：

参数	说明
formatter	用于格式化 Y 轴标签，支持回调函数的形式。回调函数格式：(value, index) => {}, value 是 formatter 需要的数据。

说人话：

        目标一，对数据进行计算

        目标二，对数据进行渲染

        目标三、四，让数据以"????M"的形式展现

---

本题作者想说

答案：

/**人口数据增长推算函数* @param {number} initialPopulation 基础人口数，假设有 10 亿* @param {number} growthRate 年增长率，假设为 3%* @param {number} startYear 起始年份，假设为 200000*/
function calculatePopulation(initialPopulation, growthRate, startYear) {const years = [];const population = [];// TODO：待补充代码 目标 1 years.push(startYear)population.push(initialPopulation)for (let index = 1; index <= 30; index++) {startYear = 200000 + indexyears.push(startYear)let pepTotNum = population[index - 1] + (population[index - 1] * growthRate)population.push(pepTotNum)}// for (let i = 0; i <= 30; i++) {//     years.push(i + startYear)//     population.push(initialPopulation * Math.pow((1 + growthRate), i))// }return {years,population};
}// 配置 ECharts 选项
const option = {title: {text: '未来30年人口增长趋势图',subtext: '假设年增长率为3%',left: 'center'},tooltip: {trigger: 'axis',// TODO：待补充代码 目标 3 formatter: (params) => {// console.log(params)return `<p>${params[0].name}<br/>人口：${Math.round(params[0].value / 1000000)}M</p>`}},xAxis: {type: 'category',// TODO：待修改代码 目标 2 // 年份data: pData.years,name: '年份',boundaryGap: false},yAxis: {type: 'value',name: '人口数',axisLabel: {// TODO：待补充代码 目标 4formatter: (value, index) => {return `${Math.round(value / 1000000)}M`}}},series: [{name: '人口',type: 'line',// TODO：待修改代码 目标 2 // 人口数量data: pData.population,smooth: true,lineStyle: {color: '#3398DB'},itemStyle: {color: '#3398DB'}}]
};

作者自我解释版：

/**人口数据增长推算函数* @param {number} initialPopulation 基础人口数，假设有 10 亿* @param {number} growthRate 年增长率，假设为 3%* @param {number} startYear 起始年份，假设为 200000*/
function calculatePopulation(initialPopulation, growthRate, startYear) {const years = [];const population = [];// TODO：待补充代码 目标 1 // 判题中可能会涉及到没有使用Math.pow而被判错，但是不必担心，考试时候不会有这种情况// 在此给出两种做题方法// 第一种自己做的，能实现，容易理解，却不能过// 第二种题解给出的，能实现，但不容易理解，却能过// 自己做的，使用一个比较容易理解的方法解决出来的// 将初始年份push到数组里，形成第一个年份years.push(startYear)// 将初始人口基数push到数组里，形成第一个人口，以后会按照这个基数来计算population.push(initialPopulation)// 因为要进行每年的计算，所以我们这里使用for循环，并且设置少于30for (let index = 1; index <= 30; index++) {// 每增加一年startYear = 200000 + index// 就push过去一年years.push(startYear)// 每增加一年，就以上一年的人口为基数计算本人人数let pepTotNum = population[index - 1] + (population[index - 1] * growthRate)// 将本年人口push过来population.push(pepTotNum)}// 题解中给出的，因为使用了Math.pow，所以判题给过// for (let i = 0; i <= 30; i++) {//     years.push(i + startYear)//     population.push(initialPopulation * Math.pow((1 + growthRate), i))// }return {years,population};
}// 配置 ECharts 选项
const option = {title: {text: '未来30年人口增长趋势图',subtext: '假设年增长率为3%',left: 'center'},tooltip: {trigger: 'axis',// TODO：待补充代码 目标 3 // 题目中给出tooltip的API：formatter，注意要以支持回调函数的形式formatter: (params) => {// 直接对数据进行html方面的更改，简单省事return `<p>${params[0].name}<br/>人口：${Math.round(params[0].value / 1000000)}M</p>`}},xAxis: {type: 'category',// TODO：待修改代码 目标 2 // 年份// 因为题目中定义了pData来获取我们计算的目标，所以直接使用即可// 将其中的years赋值给x轴data: pData.years,name: '年份',boundaryGap: false},yAxis: {type: 'value',name: '人口数',axisLabel: {// TODO：待补充代码 目标 4// 类似给出了yAxis.axisLabel的APIformatter: (value, index) => {// 类似直接对数据进行html方面的更改return `${Math.round(value / 1000000)}M`}}},series: [{name: '人口',type: 'line',// TODO：待修改代码 目标 2 // 人口数量// 将其中的population赋值给y轴data: pData.population,smooth: true,lineStyle: {color: '#3398DB'},itemStyle: {color: '#3398DB'}}]
};

---

感谢观看此篇文章，谢谢大家的支持，本片文章只是我自己学习的历程，有些写的不好地方欢迎大家交流改动。

长路漫漫，我们还需努力！