Recientemente, Xiao Bengcong vio un video súper ardiente que muestra los cambios en las clasificaciones del PIB de varios países en la Estación B. Cuando vi que China superó al número uno del mundo, ¡ese orgullo se hizo realidad!
Enlace original a la cuenta oficial de WeChat (CSDN no puede cargar video)
Mientras suspira, Xiaobencong también siente curiosidad acerca de cómo se hacen tales gráficos visuales. Encontré la página de inicio de la estación B donde se encontró el autor Jannchie:
哔 哩 哔 哩 (゜ - ゜) Tostada Ro ~ Bilibili space.bilibili.com
Haga clic adentro para encontrar muchos videos interesantes y geniales.
¡Bueno, yo también quiero aprender!
¿Cómo lo logró? Resultó que utilizó una biblioteca de JavaScript para mostrar datos en gráficos dinámicos: D3.js. Entonces, si no puedes hacer D3.js, ¿no puedes hacerlo? Por supuesto que no, Jannchie muy amablemente dio un tutorial simple de mano a mano: vea el tutorial de mano a mano
Lo más importante es que también abrió el código fuente del programa, que se puede lograr en solo 2 pasos:
- Vaya a su página de inicio de Github para descargar el código fuente en la computadora local: https://github.com/Jannchie/Historical-ranking-data-visualization-based-on-d3.js
- Abra los archivos en la carpeta
exampe.csv, ingrese los datos que desea mostrar y luego use el navegador para abrir labargraph.htmlpágina web, puede lograr efectos dinámicos. Solo preste atención a los requisitos de formato de datos utilizados.
La siguiente es una aplicación de ejemplo de Xiaobencong. Primero rastree y procese los datos de las clasificaciones de la universidad, y luego use el código fuente para visualizar los datos.
Siente el efecto de antemano
1. Rastreo de datos de clasificación universitaria
(1) Fuente de datos
Hay 4 categorías en el ranking de las universidades más autorizadas del mundo, a saber:
- Ex ARWU (Rama Suave) de la Universidad Jiaotong de Shanghai
http://www.shanghairanking.com/ARWU2018.html - QS de la Organización Británica de Educación
https://www.topuniversities.com/university-rankings/world-university-rankings/2018 - Thames THE
https://www.timeshighereducation.com/world-university-rankings - Usnews en los EE. UU.
Https://www.usnews.com/best-colleges/rankings
Aquí, seleccionamos el primer resultado de clasificación ARWU que es relativamente autoritario y más en línea con las condiciones nacionales. Abra el sitio web oficial, puede ver las versiones en inglés y chino de la clasificación de 2003 a 2018, seleccione la versión en chino aquí.
Determine la fuente de datos y luego puede rastrear los datos hacia abajo.
(2) Analice la URL para obtener el contenido
La URL de la página web todavía es muy simple. Cambia con el año. Capturamos diez años de datos, simplemente construimos un bucle for en main, y el formato de la url se muestra en el código. Además, debe tenerse en cuenta que las páginas web utilizadas en años diferentes tienen codificaciones diferentes. La respuesta de respuesta.test será ilegible, pero la respuesta de respuesta.content no.
1 def get_one_page(year):
2 try:
3 headers = {
4 'User-Agent': 'Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36'
5 }
6 # 英文版
7 # url = 'http://www.shanghairanking.com/ARWU%s.html' % (str(year))
8 # 中文版
9 url = 'http://www.zuihaodaxue.com/ARWU%s.html' % (str(year))
10 response = requests.get(url,headers = headers)
11 # 2009-2015用'gbk'，2016-2018用'utf-8'
12 if response.status_code == 200:
13 return response.content
14 return None
15 except RequestException:
16 print('爬取失败')
(3) Formulario de análisis
Use la función read_html para tomar la tabla y realizar el procesamiento necesario en la tabla.
1 def parse_one_page(html,i):
2 tb = pd.read_html(html)[0]
3 # 重命名表格列，不需要的列用数字表示
4 tb.columns = ['world rank','university', 2,3, 'score',4]
5 tb.drop([2,3],axis = 1,inplace = True)
6
7 # rank列100名后是区间，需唯一化，增加一列index作为排名
8 tb['index_rank'] = tb.index
9 tb['index_rank'] = tb['index_rank'].astype(int) + 1
10 # 增加一列年份列
11 tb['year'] = i
12 # read_html没有爬取country，需定义函数单独爬取
13 tb['country'] = get_country(html)
14 print(tb) # 测试表格ok
15 return tb
16 print(tb.info()) # 查看表信息
Los datos de la tabla en este momento están incompletos porque el país no ha sido capturado. El país está representado por una imagen en la página web, porque podemos ubicar la ubicación del código del país.
Quítatelo. El país está representado por una imagen en la página web, porque podemos ubicar la ubicación del código del país.
Puede ver que Estados Unidos se expresa en inglés EE. UU., Luego podemos extraer el atributo src por separado y luego usar regular para extraer el nombre del país.
1 def get_country(html):
2 soup = BeautifulSoup(html,'lxml')
3 countries = soup.select('td > a > img')
4 lst = []
5 for i in countries:
6 src = i['src']
7 pattern = re.compile('flag.*\/(.*?).png')
8 country = re.findall(pattern,src)[0]
9 lst.append(country)
10 return lst
world rank university score ... index_rank year country
0 1 哈佛大学 100.0 ... 1 2018 USA
1 2 斯坦福大学 75.6 ... 2 2018 USA
2 3 剑桥大学 71.8 ... 3 2018 UK
3 4 麻省理工学院 69.9 ... 4 2018 USA
4 5 加州大学-伯克利 68.3 ... 5 2018 USA
5 6 普林斯顿大学 61.0 ... 6 2018 USA
6 7 牛津大学 60.0 ... 7 2018 UK
7 8 哥伦比亚大学 58.2 ... 8 2018 USA
8 9 加州理工学院 57.4 ... 9 2018 USA
9 10 芝加哥大学 55.5 ... 10 2018 USA
10 11 加州大学-洛杉矶 51.2 ... 11 2018 USA
11 12 康奈尔大学 50.7 ... 12 2018 USA
12 12 耶鲁大学 50.7 ... 13 2018 USA
13 14 华盛顿大学-西雅图 50.0 ... 14 2018 USA
14 15 加州大学-圣地亚哥 47.8 ... 15 2018 USA
15 16 宾夕法尼亚大学 46.4 ... 16 2018 USA
16 17 伦敦大学学院 46.1 ... 17 2018 UK
17 18 约翰霍普金斯大学 45.4 ... 18 2018 USA
18 19 苏黎世联邦理工学院 43.9 ... 19 2018 Switzerland
19 20 华盛顿大学-圣路易斯 42.1 ... 20 2018 USA
20 21 加州大学-旧金山 41.9 ... 21 2018 USA
21 22 东京大学 41.5 ... 22 2018 Japan
22 23 多伦多大学 40.9 ... 23 2018 Canada
23 24 伦敦帝国学院 40.1 ... 24 2018 UK
24 25 西北大学（埃文斯顿） 39.9 ... 25 2018 USA
25 26 杜克大学 39.7 ... 26 2018 USA
26 27 密歇根大学-安娜堡 39.4 ... 27 2018 USA
27 28 威斯康星大学-麦迪逊 38.9 ... 28 2018 USA
28 29 哥本哈根大学 38.7 ... 29 2018 Denmark
29 30 洛克菲勒大学 37.9 ... 30 2018 USA(4) Procesamiento de datos
Continúe procesando el archivo university.csv generado anteriormente. Además, este código no solo puede obtener clasificaciones de las universidades del continente, sino que también enumera clasificaciones que incluyen Hong Kong, Macao y Taiwán y clasificaciones de universidades estadounidenses. Xiaobencong también definió una función topn, que puede encontrar la lista de las 20 mejores universidades por año.
1def analysis():
2 df = pd.read_csv('university.csv')
3 # 内地
4 df = df.query("(country == 'China')")[['university','year','index_rank']]
5
6 df['index_rank_score'] = df['index_rank']
7 # 将index_rank列转为整形
8 df['index_rank'] = df['index_rank'].astype(int)
9 # 含港澳台
10 # df = df.query("(country == 'China')|(country == 'China-hk')|(country == 'China-tw')|
# (country == 'China-HongKong')|(country == 'China-Taiwan')|(country == 'Taiwan,China')|(country == 'HongKong,China')")[['university','year','index_rank']]
11 # 美国
12 # df = df.query("(country == 'UnitedStates')|(country == 'USA')")[['university','year','index_rank']]
13 #求topn名
14 def topn(df):
15 top = df.sort_values(['year','index_rank'],ascending = True)
16 return top[:20].reset_index()
17 df = df.groupby(by =['year']).apply(topn)
18 # 更改列顺序
19 df = df[['university','index_rank_score','index_rank','year']]
20 # 重命名列
21 df.rename (columns = {'university':'name','index_rank_score':'type','index_rank':'value','year':'date'},inplace = True)
22 # 输出结果
23 df.to_csv('university_ranking.csv',mode ='w',encoding='utf_8_sig', header=True, index=False)
El efecto de los datos de la tabla obtenida es el siguiente:
2. Visualización de datos
Primero descargue el código fuente de la página de inicio de Github , luego arrastre y suelte bargraph.html en el navegador, haga clic para seleccionar el archivo, seleccione el archivo university_ranking.csv que acaba de descargar y verá el gráfico de datos dinámicos.
Sin embargo, todavía hay algunas cosas que deben mejorarse, como el tamaño de fuente, el color de la columna, la posición del elemento de datos, la inversión del gráfico, etc. Estos parámetros se pueden modificar en el archivo de código fuente. Por supuesto, la forma más conveniente es cambiarlo primero en la hoja de estilo CSS de la página web y luego modificarlo en el código fuente.
El código fuente tiene cuatro archivos para una fácil modificación de parámetros:
- config.js : configure el interruptor de cada función, como la coincidencia de colores, la fuente, si se debe invertir el gráfico, etc.
- color_ranges.js : modifica el color del gráfico de columnas;
- stylesheet.css : modifica específicamente el estilo css de coincidencia de color, fuente, nombre de texto, etc.
- visual.js : modificaciones adicionales, como la transparencia del gráfico.
Por supuesto, si eres flojo, ya lo he modificado (de hecho, no es fácil de modificar ...).
Lo anterior es el proceso de análisis de rastreo de datos de clasificación universitaria y creación de íconos dinámicos.
WeChat cuenta pública " estudiante financiero que aprende a programar " back-end " ranking universitario " para obtener el código fuente.
Enlace original a la cuenta oficial de WeChat
Recomendado en el pasado
1. reproductor de música casera
2. The Wandering Earth Movie Review
3. Norte de Shanghai, Guangzhou y Shenzhen libro de alquiler
¡Tus gustos y atención es mi mayor apoyo!
Guarde el código de escaneo y preste atención al número público
