日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔！

生活随笔

當前位置： 首頁 > 编程资源 > 编程问答 >内容正文

编程问答

msdn画圆弧函数_精确之美——用TikZ画硬盘示意图

發(fā)布時間：2024/7/19 编程问答 42 豆豆
生活随笔 收集整理的這篇文章主要介紹了 msdn画圆弧函数_精确之美——用TikZ画硬盘示意图 小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

序言

備考某等級考試的時候，在教材中碰到了幾個一直不太理解的、關(guān)于硬盤的概念：磁道、柱面號、扇區(qū)。然而教材沒有配圖，無法直觀地了解這些概念的物理形態(tài)。維基百科的硬盤[1]詞條頁中倒是有一副不錯的示意圖，我截圖搬運了過來

機械硬盤示意圖

原圖是一張 SVG 圖片，本質(zhì)上是一堆指令——也就是所謂的語繪啦。我是一個語繪愛好者，也想試試看能否用代碼畫一幅差不多的圖出來。

在舊文《程序員特有的畫圖方式——語繪工具小入門》[2]中，我演示過幾款寫代碼畫圖的工具，但它們都不適合用來繪制幾何圖形，所以這次它們沒有用武之地。

本來我想試試用MetaPost[3]來畫的，但鑒于“入門”了太多次，這次還是換點新花樣吧。這一次，我用 LaTeX+TikZ 來畫。

TikZ 是什么及光速入門

著名的壓泡面神器、麻將桌腳墊《TAOCP》的作者發(fā)明了TeX[4]，知名的Raft 競品Paxos 算法的作者在此基礎(chǔ)上創(chuàng)造了LaTeX[5]，它們都是程序員簡歷論文排版的好幫手。而 TikZ 則是如虎添翼地在 LaTeX 中實現(xiàn)了簡單易懂的繪圖功能的一個紅包宏包(macro package，TeX 的術(shù)語)。簡而言之，TikZ 自定義了一套“語言”，可以在用 LaTeX 編寫的文檔中畫出各種圖形。

百聞不如一見，我演示一下如何用 TikZ 畫一條線段、一個圓，以及一段圓弧。先將下列的代碼保存到一個文件three_in_one.tex中

\documentclass{standalone}
\usepackage{tikz}
\usetikzlibrary{shapes.geometric, arrows}
\begin{document}
\begin{tikzpicture}[scale=2]
%% 畫一條從原點指向(1, 1)的線段
\draw (0, 0) -- (1, 1);
%% 畫一個以(1, 1)為圓心，半徑為2的圓。
\draw (1, 1) circle (2);
%% 畫一段以原點為圓心，半徑為1，張開角度為30度的圓弧。
\draw (1, 0) arc (0:30:1);
\end{tikzpicture}
\end{document}

再使用xelatex將其編譯成 PDF 文件(xelatex可以通過安裝 TeXLive 2020 獲得)

xelatex?three_in_one.tex

此時便得到了three_in_one.pdf文件。為了可以在文章中顯示，我用 ImageMagick 將其轉(zhuǎn)換為 PNG 文件

convert?three_in_one.pdf?/tmp/three_in_one.png

最終的圖片如下

簡單，就像畫一匹馬一樣簡單。

現(xiàn)在該來試試用 TikZ 復(fù)刻維基百科上的硬盤示意圖了。

來點同心圓

在原圖中最引人注目的，當屬那十幾個同心圓了。簡單起見，我只畫六個圓。這六個圓的半徑相差1pt(pt是 TikZ 默認的長度單位)，從3pt一直遞增到8pt，它們的圓心都在坐標原點(0, 0)上。

%% 為了節(jié)省篇幅，只給出TikZ部分的代碼。
\begin{tikzpicture}
\draw (0, 0) circle (3);
\draw (0, 0) circle (4);
\draw (0, 0) circle (5);
\draw (0, 0) circle (6);
\draw (0, 0) circle (7);
\draw (0, 0) circle (8);
\end{tikzpicture}

來點等分線

原圖中有 12 根線段，將每一個圓等分成了全等的 12 份。從前一節(jié)的內(nèi)容可知，要用\draw命令繪制線段，需要的是線段兩端的坐標，那么這批坐標要怎么計算呢？盡管可以用三角函數(shù)計算出這些點的笛卡爾坐標，但在 TikZ 中可以用更方便的極坐標來指定這些點。

以原圖中從 X 軸開始逆時針旋轉(zhuǎn)遇到的第一條線段為例，它在半徑為3pt的圓上的點的坐標為(30:3)(30 是極坐標中的角度，3 是半徑長度)，而在半徑為8pt的圓上的點的坐標為(30:8)，因此可以用\draw (30:3) -- (30:8)來畫出這根線段。

通過調(diào)整其中的角度可以畫出剩余的其它線段。

\begin{tikzpicture}
\draw (0, 0) circle (3);
\draw (0, 0) circle (4);
\draw (0, 0) circle (5);
\draw (0, 0) circle (6);
\draw (0, 0) circle (7);
\draw (0, 0) circle (8);

\draw (0:3) -- (0:8);
\draw (30:3) -- (30:8);
\draw (60:3) -- (60:8);
\draw (90:3) -- (90:8);
\draw (120:3) -- (120:8);
\draw (150:3) -- (150:8);
\draw (180:3) -- (180:8);
\draw (210:3) -- (210:8);
\draw (240:3) -- (240:8);
\draw (270:3) -- (270:8);
\draw (300:3) -- (300:8);
\draw (330:3) -- (330:8);
\end{tikzpicture}

來張色圖

原圖大致的骨架已經(jīng)畫完了，現(xiàn)在來嘗試給它上色。在 TikZ 中，可以用\fill命令給一段封閉的曲線上色。比如用\fill[red] (0, 0) -- (1, 0) -- (1, 1) -- (0, 1) -- cycle可以將左下角在原點、邊長為1pt的正方形涂成紅色。

先給原圖中的區(qū)域 B 上色。區(qū)域 B 是一個扇形，它由兩根長度為8pt的半徑和一段夾角為 30 度的圓弧構(gòu)成。要描述這段封閉曲線，可以借助入門一節(jié)中介紹的arc命令。

\begin{tikzpicture}
%% 給區(qū)域B上色。
\fill[blue] (0, 0) -- (30:8) arc (30:60:8) -- cycle;

\draw (0, 0) circle (3);
\draw (0, 0) circle (4);
\draw (0, 0) circle (5);
\draw (0, 0) circle (6);
\draw (0, 0) circle (7);
\draw (0, 0) circle (8);

\draw (0:3) -- (0:8);
\draw (30:3) -- (30:8);
\draw (60:3) -- (60:8);
\draw (90:3) -- (90:8);
\draw (120:3) -- (120:8);
\draw (150:3) -- (150:8);
\draw (180:3) -- (180:8);
\draw (210:3) -- (210:8);
\draw (240:3) -- (240:8);
\draw (270:3) -- (270:8);
\draw (300:3) -- (300:8);
\draw (330:3) -- (330:8);
\end{tikzpicture}

\fill命令那一行最后的cycle的意思，是讓曲線回到起點組成一個封閉的形狀。另外，\fill命令需要寫在\draw命令之前，是為了避免藍色顏料將區(qū)域內(nèi)的圓弧給蓋住了。

對于區(qū)域 C 和區(qū)域 D，方法是一樣的，只是描述封閉曲線的坐標不同罷了。

\begin{tikzpicture}
%% 給區(qū)域B上色。
\fill[blue] (0, 0) -- (30:8) arc (30:60:8) -- cycle;
%% 給區(qū)域C上色。
\fill[purple] (30:4) -- (30:5) arc (30:60:5) -- (60:4) -- (60:4) arc (60:30:4);
%% 給區(qū)域D上色。
\fill[green] (240:6) -- (240:7) arc (240:330:7) -- (330:6) -- (330:6) arc (330:240:6);

\draw (0, 0) circle (3);
\draw (0, 0) circle (4);
\draw (0, 0) circle (5);
\draw (0, 0) circle (6);
\draw (0, 0) circle (7);
\draw (0, 0) circle (8);

\draw (0:3) -- (0:8);
\draw (30:3) -- (30:8);
\draw (60:3) -- (60:8);
\draw (90:3) -- (90:8);
\draw (120:3) -- (120:8);
\draw (150:3) -- (150:8);
\draw (180:3) -- (180:8);
\draw (210:3) -- (210:8);
\draw (240:3) -- (240:8);
\draw (270:3) -- (270:8);
\draw (300:3) -- (300:8);
\draw (330:3) -- (330:8);
\end{tikzpicture}

給環(huán)形上色

聰明的讀者也許已經(jīng)發(fā)現(xiàn)了，區(qū)域 A 的環(huán)形沒辦法用這種方式來描述。不過沒關(guān)系，只要將其視為上下半兩部分，再分別上色即可。

\begin{tikzpicture}
%% 環(huán)的上半部分
\fill[red] (4, 0) -- (5, 0) arc (0:180:5) -- (-4, 0) -- (-4, 0) arc (180:0:4);
%% 環(huán)的下半部分
\fill[red] (4, 0) -- (5, 0) arc (360:180:5) -- (-4, 0) -- (-4, 0) arc (180:360:4);
%% 給區(qū)域B上色。
\fill[blue] (0, 0) -- (30:8) arc (30:60:8) -- cycle;
%% 給區(qū)域C上色。
\fill[purple] (30:4) -- (30:5) arc (30:60:5) -- (60:4) -- (60:4) arc (60:30:4);
%% 給區(qū)域D上色。
\fill[green] (240:6) -- (240:7) arc (240:330:7) -- (330:6) -- (330:6) arc (330:240:6);

\draw (0, 0) circle (3);
\draw (0, 0) circle (4);
\draw (0, 0) circle (5);
\draw (0, 0) circle (6);
\draw (0, 0) circle (7);
\draw (0, 0) circle (8);

\draw (0:3) -- (0:8);
\draw (30:3) -- (30:8);
\draw (60:3) -- (60:8);
\draw (90:3) -- (90:8);
\draw (120:3) -- (120:8);
\draw (150:3) -- (150:8);
\draw (180:3) -- (180:8);
\draw (210:3) -- (210:8);
\draw (240:3) -- (240:8);
\draw (270:3) -- (270:8);
\draw (300:3) -- (300:8);
\draw (330:3) -- (330:8);
\end{tikzpicture}

潤色一下

用 macOS 的“數(shù)碼測色計”看了一下原圖中各個區(qū)域的顏色的 RGB 值，區(qū)域 A 大概是(236, 133, 130)、區(qū)域 B 大概是(122, 127, 237)、區(qū)域 C 大概是(131, 132, 139)、區(qū)域 D 大概是(0, 151, 27)。接下來我讓 TikZ 以這四種指定的顏色填充圖中的四個區(qū)域，先用 LaTeX 的\definecolor命令定義四個新的顏色的名字。

%% 下列四行代碼置于document環(huán)境之前
\definecolor{areaA}{RGB}{236,133,130}
\definecolor{areaB}{RGB}{122,127,237}
\definecolor{areaC}{RGB}{131,32,139}
\definecolor{areaD}{RGB}{0,151,27}

再替換掉\fill命令中的顏色名即可

\begin{tikzpicture}
%% 環(huán)的上半部分
\fill[areaA] (4, 0) -- (5, 0) arc (0:180:5) -- (-4, 0) -- (-4, 0) arc (180:0:4);
%% 環(huán)的下半部分
\fill[areaA] (4, 0) -- (5, 0) arc (360:180:5) -- (-4, 0) -- (-4, 0) arc (180:360:4);
%% 給區(qū)域B上色。
\fill[areaB] (0, 0) -- (30:8) arc (30:60:8) -- cycle;
%% 給區(qū)域C上色。
\fill[areaC] (30:4) -- (30:5) arc (30:60:5) -- (60:4) -- (60:4) arc (60:30:4);
%% 給區(qū)域D上色。
\fill[areaD] (240:6) -- (240:7) arc (240:330:7) -- (330:6) -- (330:6) arc (330:240:6);

\draw (0, 0) circle (3);
\draw (0, 0) circle (4);
\draw (0, 0) circle (5);
\draw (0, 0) circle (6);
\draw (0, 0) circle (7);
\draw (0, 0) circle (8);

\draw (0:3) -- (0:8);
\draw (30:3) -- (30:8);
\draw (60:3) -- (60:8);
\draw (90:3) -- (90:8);
\draw (120:3) -- (120:8);
\draw (150:3) -- (150:8);
\draw (180:3) -- (180:8);
\draw (210:3) -- (210:8);
\draw (240:3) -- (240:8);
\draw (270:3) -- (270:8);
\draw (300:3) -- (300:8);
\draw (330:3) -- (330:8);
\end{tikzpicture}

圖文并茂

剩下的需要復(fù)刻的東西就是原圖中的文字以及標注用的線了。線很容易畫，只要規(guī)定了坐標后用\draw命令即可。比如說，我可以把四條線定義如下，其中的坐標和線段的長度純粹是個人偏好

\draw (75:4.5) -- (75:9);
\draw (40:7.5) -- (40:9);
\draw (50:4.5) -- (50:9);
\draw (285:6.5) -- (285:9);

線畫完了，再到每一根線的“終點”標上文字說明，這需要用到 TikZ 的node功能。用法很簡單，就是在需要標注文字的坐標后，緊跟著關(guān)鍵字node，以及一段用花括號包裹的文本即可

\documentclass{standalone}
\usepackage{tikz}
\usepackage{xeCJK}
\setCJKmainfont{Songti TC}
\usetikzlibrary{shapes.geometric, arrows}
\definecolor{areaA}{RGB}{236,133,130}
\definecolor{areaB}{RGB}{122,127,237}
\definecolor{areaC}{RGB}{131,32,139}
\definecolor{areaD}{RGB}{0,151,27}
\begin{document}
\begin{tikzpicture}
%% 環(huán)的上半部分
\fill[areaA] (4, 0) -- (5, 0) arc (0:180:5) -- (-4, 0) -- (-4, 0) arc (180:0:4);
%% 環(huán)的下半部分
\fill[areaA] (4, 0) -- (5, 0) arc (360:180:5) -- (-4, 0) -- (-4, 0) arc (180:360:4);
%% 給區(qū)域B上色。
\fill[areaB] (0, 0) -- (30:8) arc (30:60:8) -- cycle;
%% 給區(qū)域C上色。
\fill[areaC] (30:4) -- (30:5) arc (30:60:5) -- (60:4) -- (60:4) arc (60:30:4);
%% 給區(qū)域D上色。
\fill[areaD] (240:6) -- (240:7) arc (240:330:7) -- (330:6) -- (330:6) arc (330:240:6);

\draw (0, 0) circle (3);
\draw (0, 0) circle (4);
\draw (0, 0) circle (5);
\draw (0, 0) circle (6);
\draw (0, 0) circle (7);
\draw (0, 0) circle (8);

\draw (0:3) -- (0:8);
\draw (30:3) -- (30:8);
\draw (60:3) -- (60:8);
\draw (90:3) -- (90:8);
\draw (120:3) -- (120:8);
\draw (150:3) -- (150:8);
\draw (180:3) -- (180:8);
\draw (210:3) -- (210:8);
\draw (240:3) -- (240:8);
\draw (270:3) -- (270:8);
\draw (300:3) -- (300:8);
\draw (330:3) -- (330:8);

\draw (75:4.5) -- (75:9) node {磁道};
\draw (40:7.5) -- (40:9) node {扇面};
\draw (50:4.5) -- (50:9) node {扇區(qū)};
\draw (285:6.5) -- (285:9) node {簇};
\end{tikzpicture}
\end{document}

需要留意的是，我在源代碼開頭的位置，引入了xeCJK宏包(\usepackage{xeCJK})，并且指定了中文內(nèi)容用的字體為宋體(\setCJKmainfont{Songti TC})，這樣才能成功編譯。

至此，復(fù)刻算是完成了。

后記

本文只是管中窺豹，TikZ 還可以畫出其它更復(fù)雜更美輪美奐的圖形，有興趣的讀者可以移步這里[6]觀賞。此外，TikZ 也可以“編程”，比如下面的兩行代碼便足矣畫出上文中 12 行代碼才完成的等分線

\foreach \x in {0,30,60,90,120,150,180,210,240,270,300,330}
\draw (\x:3) -- (\x:8);

TikZ 的更多潛力和樂趣，就由各位讀者自己探索吧。

如果你想要和我交流，歡迎點擊閱讀原文到我的博客上發(fā)表評論。

參考資料

[1]

硬盤: https://zh.wikipedia.org/wiki/%E7%A1%AC%E7%9B%98

[2]

《程序員特有的畫圖方式——語繪工具小入門》: https://liutos.github.io/2020/05/07/%E7%A8%8B%E5%BA%8F%E5%91%98%E7%89%B9%E6%9C%89%E7%9A%84%E7%94%BB%E5%9B%BE%E6%96%B9%E5%BC%8F%E2%80%94%E2%80%94%E8%AF%AD%E7%BB%98%E5%B7%A5%E5%85%B7%E5%B0%8F%E5%85%A5%E9%97%A8/

[3]

MetaPost: https://zh.wikipedia.org/wiki/MetaPost

[4]

TeX: https://zh.wikipedia.org/wiki/TeX

[5]

LaTeX: https://zh.wikipedia.org/wiki/LaTeX

[6]

這里: https://texample.net/tikz/examples/

點擊進入留言區(qū)

總結(jié)

以上是生活随笔為你收集整理的msdn画圆弧函数_精确之美——用TikZ画硬盘示意图的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。