百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术资源 > 正文

教你用Python绘制谷歌浏览器的3种图标

off999 2025-07-10 20:01 5 浏览 0 评论

前两天在浏览matplotlib官方网站时,笔者无意中看到一个挺有意思的图片,就是用matplotlib制作的火狐浏览器的logo,也就是下面这个东东(网页地址是
https://matplotlib.org/gallery/showcase/firefox.html#
sphx-glr-gallery-showcase-firefox-py)。顿时再次感到Python的强大,Python真是除了生孩子神马都能干,当时就有了一个想法,笔者最常用的是Chrome浏览器,能不能用Python制作一个Chrome的logo呢,于是乎就动手试了一下,没想到还真成功了,下面就分享一下制作的过程。


首先给大家展示一下Chrome浏览器官方的logo,就是下面的这个图片。Chrome的logo实际上非常简单,比火狐的要容易不少,基本上就是红、绿、黄三部分和中间的那个圆,中间的圆圈很好处理,主要就是红、绿、黄这三部分复杂一些,因为每个色块都是一个不规则图形。但我们仔细观察就会发现,每个色块其实可以分为两个规则的图形,大致就是一个扇形的顶部(即扇形去掉下面的三角形)加上一个小三角形,这样分解一下就容易多了。如果看到这里还没明白,不要紧,后面会一步一步分析一下。


首先还是导入需要的各种包。

import matplotlib.pyplot as plt

from matplotlib.collections import PatchCollection

from matplotlib.patches import Circle, Wedge, Polygon

接下来一步一步分析。首先从3个色块开始处理,刚才说了,每个色块相当于一个扇形顶部+一个小三角形,那么我们先画出3个扇形,每个扇形是三分之一个圆。代码如下。

fig, ax = plt.subplots(figsize=[8, 8])

plt.ylim([0,40])

plt.xlim([0,40])

patches = []

w1 = Wedge(center=[20,20], r=10, theta1=30, theta2=150, facecolor='red', edgecolor=None, zorder=1)

w2 = Wedge(center=[20,20], r=10, theta1=150, theta2=270, facecolor='green', edgecolor=None, zorder=1)

w3 = Wedge(center=[20,20], r=10, theta1=270, theta2=390, facecolor='yellow', edgecolor=None, zorder=1)

patches.extend([w1, w2, w3])

为了把这3个色块的效果展示出来,我们还要再加上下面3行代码。这3行代码我们暂且称为"显示代码",用来显示结果,之所以分得如此细致,是因为要让大家了解每个步骤的原理,实际上最后的代码是全部连在一起的,这3行"显示代码"是在全部代码的最后。

p = PatchCollection(patches, match_original=True)

ax.add_collection(p)

plt.show()


再接下来加上3个小三角形。

p1 = Polygon([[20-5*3**0.5, 25], [20-2.5*3**0.5, 17.5], [20, 25]], facecolor='red', edgecolor=None, zorder=2)

p2 = Polygon([[20-2.5*3**0.5, 17.5], [20, 10], [20+2.5*3**0.5, 17.5]], facecolor='green', edgecolor=None, zorder=2)

p3 = Polygon([[20+2.5*3**0.5, 17.5], [20+5*3**0.5, 25], [20, 25]], facecolor='yellow', edgecolor=None, zorder=2)

patches.extend([p1, p2, p3])

加上以后显示结果如下图所示。


这个图有点不太规则,可能这里有人不太明白,这3个小三角形到底加到了哪里。表慌,我们把原来的3个扇形去掉,只添加3个小三角形,再看看结果,如下图所示。


这下应该清楚多了。这3个小三角形都是等边三角形,其边长正好等于扇形顶部那条直角边的一半,每个三角形都有两条边和相邻两个扇形顶部的直角边重合。然后我们再加上两个圆,代码如下。

c1 = Circle((20, 20), 5, facecolor='white', edgecolor=None, zorder=3)

c2 = Circle((20, 20), 4, facecolor='blue', edgecolor=None, zorder=4)

patches.extend([c1, c2])

第一个圆大一点,是白色,第二个小一点,是蓝色的,两个是同心圆,圆心正好和3个扇形的圆心重合,完成图如下。这里有两点要注意的,一是每个图形的zorder属性,这个数字越大,图层越靠上,上面的图层会覆盖下面的图层;二是显示代码中,有一行代码是p = PatchCollection(patches, match_original=True),match_original意思是匹配原有图形的属性,如果不加这个属性或者设置为False,那么原有图形的设置就不会显示,而是按照系统默认的方式显示,最终的结果可能不是我们想要的,所以一定要把这个属性设置为True。


最后再加上"冰块版"的Chromium和"油炸版"的Canary Chrome这两个的logo,只要把上面代码的颜色换一下就行了,冰块版中的4种颜色是"#2976bb"、"#75bbfd"、"#a2cffe"和"#1e90ff",油炸版中的4种颜色是"#cb9d06"、"#fac205"、"#f4d054"和"#f5bf03"。



好了,用matplotlib制作Chrome浏览器logo的方法就介绍完了。最后还有一个问题,世界3大浏览器,火狐和Chrome都能用Python制作了,只剩下微软的edge了,有没有人想挑战一下。


相关推荐

推荐一款Python的GUI可视化工具(python 可视化工具)

在Python基础语法学习完成后,进一步开发应用界面时,就需要涉及到GUI了,GUI全称是图形用户界面(GraphicalUserInterface,又称图形用户接口),采用图形方式显示的计算机操...

教你用Python绘制谷歌浏览器的3种图标

前两天在浏览matplotlib官方网站时,笔者无意中看到一个挺有意思的图片,就是用matplotlib制作的火狐浏览器的logo,也就是下面这个东东(网页地址是https://matplotlib....

小白学Python笔记:第二章 Python安装

Windows操作系统的python安装:Python提供Windows、Linux/UNIX、macOS及其他操作系统的安装包版本,结合自己的使用情况,此处仅记录windows操作系统的python...

Python程序开发之简单小程序实例(9)利用Canvas绘制图形和文字

Python程序开发之简单小程序实例(9)利用Canvas绘制图形和文字一、项目功能利用Tkinter组件中的Canvas绘制图形和文字。二、项目分析要在窗体中绘制图形和文字,需先导入Tkinter组...

一文吃透Python虚拟环境(python虚拟环境安装和配置)

摘要在Python开发中,虚拟环境是一种重要的工具,用于隔离不同项目的依赖关系和环境配置。本文将基于windows平台介绍四种常用的Python虚拟环境创建工具:venv、virtualenv、pip...

小白也可以玩的Python爬虫库,收藏一下

最近,微软开源了一个项目叫「playwright-python」,作为一个兴起项目,出现后受到了大家热烈的欢迎,那它到底是什么样的存在呢?今天为你介绍一下这个传说中的小白神器。Playwright是...

python环境安装+配置教程(python安装后怎么配置环境变量)

安装python双击以下软件:弹出一下窗口需选择一些特定的选项默认选项不需要更改,点击next勾选以上选项,点击install进度条安装完毕即可。到以下界面,证明安装成功。接下来安装库文件返回电脑桌面...

colorama,一个超好用的 Python 库!

大家好,今天为大家分享一个超好用的Python库-colorama。Github地址:https://github.com/tartley/coloramaPythoncolorama库是一...

python制作仪表盘图(python绘制仪表盘)

今天教大家用pyecharts画仪表盘仪表盘(Gauge)是一种拟物化的图表,刻度表示度量,指针表示维度,指针角度表示数值。仪表盘图表就像汽车的速度表一样,有一个圆形的表盘及相应的刻度,有一个指针...

总结90条写Python程序的建议(python写作)

  1.首先  建议1、理解Pythonic概念—-详见Python中的《Python之禅》  建议2、编写Pythonic代码  (1)避免不规范代码,比如只用大小写区分变量、使用容易...

[oeasy]python0137_相加运算_python之禅_import_this_显式转化

变量类型相加运算回忆上次内容上次讲了是从键盘输入变量input函数可以有提示字符串需要有具体的变量接收输入的字符串输入单个变量没有问题但是输入两个变量之后一相加就非常离谱添加图片注释,不超过1...

Python入门学习记录之一:变量(python中变量的规则)

写这个,主要是对自己学习python知识的一个总结,也是加深自己的印象。变量(英文:variable),也叫标识符。在python中,变量的命名规则有以下三点:>变量名只能包含字母、数字和下划线...

掌握Python的"魔法":特殊方法与属性完全指南

在Python的世界里,以双下划线开头和结尾的"魔法成员"(如__init__、__str__)是面向对象编程的核心。它们赋予开发者定制类行为的超能力,让自定义对象像内置类型一样优雅工...

11个Python技巧 不Pythonic 实用大于纯粹

虽然Python有一套强大的设计哲学(体现在“Python之禅”中),但总有一些情况需要我们“打破规则”来解决特定问题。这触及了Python哲学中一个非常核心的理念:“实用主义胜于纯粹主义”...

Python 从入门到精通 第三课 诗意的Python之禅

导言:Python之禅,英文名是TheZenOfPython。最早由TimPeters在Python邮件列表中发表,它包含了影响Python编程语言设计的20条软件编写原则。它作为复活节彩蛋...

取消回复欢迎 发表评论: