From 6f03baf2ec1a8a7253a8a3d1851105e111bba042 Mon Sep 17 00:00:00 2001 From: Yufan Sheng Date: Fri, 21 Jun 2024 05:17:29 +0800 Subject: [PATCH] fix: change the size of the svg --- plugins/images.ts | 25 ------------------- .../recaps/algo-minimal-costs/step1.svg | 5 ++-- .../recaps/algo-minimal-costs/step2.svg | 5 ++-- .../recaps/algo-minimal-costs/step3.svg | 5 ++-- .../recaps/algo-minimal-costs/step4.svg | 5 ++-- .../recaps/algo-minimal-costs/step5.svg | 5 ++-- .../recaps/algo-minimal-costs/step6.svg | 5 ++-- .../recaps/algo-minimal-costs/step7.svg | 5 ++-- .../recaps/algo-minimal-costs/step8.svg | 5 ++-- .../2024-04-12-algo-find-the-lowest-costs.mdx | 16 ++++++------ 10 files changed, 24 insertions(+), 57 deletions(-) diff --git a/plugins/images.ts b/plugins/images.ts index ca17f08..eb13743 100644 --- a/plugins/images.ts +++ b/plugins/images.ts @@ -13,33 +13,8 @@ type ImageNode = Parent & { attributes: (Literal & { name: string })[]; }; -type MdxJsxAttribute = { - type: 'mdxJsxAttribute'; - name: string; - value: string; -}; - -type MdxJsxFlowElement = Parent & { - name: string; - attributes: MdxJsxAttribute[]; -}; - export const astroImage = () => { return async (tree: Node) => { - // Find all the img node. - const imgs = selectAll('mdxJsxFlowElement', tree) - .map((node) => node as MdxJsxFlowElement) - .filter((node) => node.name === 'img'); - for (const img of imgs) { - const srcAttribute = img.attributes.find((attribute) => attribute.name === 'src'); - if (srcAttribute) { - const src = srcAttribute.value; - if (src.startsWith('/')) { - srcAttribute.value = urlJoin(options.assetsPrefix(), src); - } - } - } - // Find all the image node. const imageNodes = selectAll('image', tree) .map((node) => node as ImageNode) diff --git a/public/images/recaps/algo-minimal-costs/step1.svg b/public/images/recaps/algo-minimal-costs/step1.svg index 080aca1..f1b49ea 100644 --- a/public/images/recaps/algo-minimal-costs/step1.svg +++ b/public/images/recaps/algo-minimal-costs/step1.svg @@ -1,6 +1,5 @@ - - 64x64 + @@ -18,4 +17,4 @@ - \ No newline at end of file + diff --git a/public/images/recaps/algo-minimal-costs/step2.svg b/public/images/recaps/algo-minimal-costs/step2.svg index 7275f05..319f42a 100644 --- a/public/images/recaps/algo-minimal-costs/step2.svg +++ b/public/images/recaps/algo-minimal-costs/step2.svg @@ -1,6 +1,5 @@ - - 64x64 + @@ -21,4 +20,4 @@ - \ No newline at end of file + diff --git a/public/images/recaps/algo-minimal-costs/step3.svg b/public/images/recaps/algo-minimal-costs/step3.svg index c99e5f4..5af9946 100644 --- a/public/images/recaps/algo-minimal-costs/step3.svg +++ b/public/images/recaps/algo-minimal-costs/step3.svg @@ -1,6 +1,5 @@ - - 64x64 + @@ -21,4 +20,4 @@ - \ No newline at end of file + diff --git a/public/images/recaps/algo-minimal-costs/step4.svg b/public/images/recaps/algo-minimal-costs/step4.svg index 6ed22e3..661a9ad 100644 --- a/public/images/recaps/algo-minimal-costs/step4.svg +++ b/public/images/recaps/algo-minimal-costs/step4.svg @@ -1,6 +1,5 @@ - - 128x128 + @@ -38,4 +37,4 @@ - \ No newline at end of file + diff --git a/public/images/recaps/algo-minimal-costs/step5.svg b/public/images/recaps/algo-minimal-costs/step5.svg index cc02119..d89cb80 100644 --- a/public/images/recaps/algo-minimal-costs/step5.svg +++ b/public/images/recaps/algo-minimal-costs/step5.svg @@ -1,6 +1,5 @@ - - 128x128 + @@ -47,4 +46,4 @@ - \ No newline at end of file + diff --git a/public/images/recaps/algo-minimal-costs/step6.svg b/public/images/recaps/algo-minimal-costs/step6.svg index 0201f8d..7fcfcad 100644 --- a/public/images/recaps/algo-minimal-costs/step6.svg +++ b/public/images/recaps/algo-minimal-costs/step6.svg @@ -1,6 +1,5 @@ - - Untitled + @@ -54,4 +53,4 @@ - \ No newline at end of file + diff --git a/public/images/recaps/algo-minimal-costs/step7.svg b/public/images/recaps/algo-minimal-costs/step7.svg index eab12ef..876bd3a 100644 --- a/public/images/recaps/algo-minimal-costs/step7.svg +++ b/public/images/recaps/algo-minimal-costs/step7.svg @@ -1,6 +1,5 @@ - - 128x128 + @@ -47,4 +46,4 @@ - \ No newline at end of file + diff --git a/public/images/recaps/algo-minimal-costs/step8.svg b/public/images/recaps/algo-minimal-costs/step8.svg index f20f998..c71eafa 100644 --- a/public/images/recaps/algo-minimal-costs/step8.svg +++ b/public/images/recaps/algo-minimal-costs/step8.svg @@ -1,6 +1,5 @@ - - 128x128 + @@ -77,4 +76,4 @@ - \ No newline at end of file + diff --git a/src/content/posts/2024/2024-04-12-algo-find-the-lowest-costs.mdx b/src/content/posts/2024/2024-04-12-algo-find-the-lowest-costs.mdx index 5dffaca..9f8c922 100644 --- a/src/content/posts/2024/2024-04-12-algo-find-the-lowest-costs.mdx +++ b/src/content/posts/2024/2024-04-12-algo-find-the-lowest-costs.mdx @@ -46,28 +46,28 @@ cover: /images/2024/04/2024041405050511.png 这也使得这道题在弄懂原理后相当无趣，但考虑我这朋友确实经验尚浅，所以我还是给他继续讲下去，顺带着给了代码实现。这篇博客便是当时内容的摘录整理。 -Step 1 +![Step 1](/images/recaps/algo-minimal-costs/step1.svg)
做任何算法题，第一步是理解题意，第二步是设想最简单的情况，再慢慢推导到复杂情况。首先，我们先不考虑存在阻塞的情况。最简单场景里，顾客和维修点在一个 1 x 1 的格子的一条边上，这个时候他们间的最短距离为 1。
-Step 2 +![Step 2](/images/recaps/algo-minimal-costs/step2.svg)
然后我们更进一步，如果他们在一个格子的对角线上呢？他们间的最短路径有两条，为 2。
-Step 3 +![Step 3](/images/recaps/algo-minimal-costs/step3.svg)
结合初中的几何学知识，我们首先知道一个基本知识，两点之间，直线最短。所以，维修点和顾客在同一条直线上时，他们之间的距离就是直线距离。
-Step 4 +![Step 4](/images/recaps/algo-minimal-costs/step4.svg)
然后我们再稍微复杂一点，此时顾客和维修点之间是田字格，最短路径就有三条，距离为 3。
-Step 5 +![Step 5](/images/recaps/algo-minimal-costs/step5.svg)
等到田字格的时候，相信聪明的你已经发现了规律。那就是顾客到维修点的最短距离，等于他们所形成的矩形的横纵两条边边长的总和。按照上面右侧图片所示的箭头所行走的距离都等于这个最短路径。 @@ -75,7 +75,7 @@ cover: /images/2024/04/2024041405050511.png 一般情况下，面试场景的编码题已经可以开始写了。对应的编程思路就是，从维修点出发，在与顾客构成的矩形边界里面，不断逼近，只要能走通那么我们之间就有了最短距离。再把不同维修点到顾客的最短距离排序，选出最小的距离来进行计算费用。 -Step 6 +![Step 6](/images/recaps/algo-minimal-costs/step6.svg) 倘若以上面的推论作为最终编码的方式，虽然不能说完全错误，但是在当下这个面试很卷的时代，还是有可能被 PASS，为什么呢？因为我们还没有引入阻塞的概念。我们随便画两种阻塞的情况，并且假定这里都属于在当时条件下的最短路径，那么阁下又该如何应对？😆 @@ -88,11 +88,11 @@ cover: /images/2024/04/2024041405050511.png 以此为基础，我们就可以稍微来复习一下大学的算法知识了，贪心算法（贪婪算法）。贪心算法的定义网上随随便便都能找到，这里就不再复述，我们更多地是需要去思考在这个场景的贪心算法如何使用。 -Step 7 +![Step 7](/images/recaps/algo-minimal-costs/step7.svg) 贪心算法的第一步，就是找寻从顾客开始，所有可能能行走方向距离为 1 的点有哪些（图中蓝色的点）。接着，我们可以以这些距离为 1 的点为基础，去找寻所有距离为 2 的点（图中绿色的点）。以此类推，直到所有的点都没有下一个可以行走的点了。而每计算一次距离为 N 的点的时候，都可以尝试看看里面是否有对应的维修点，如果有，那么终止检索，这个 N 便是最短距离。 -Step 8 +![Step 8](/images/recaps/algo-minimal-costs/step8.svg) 如上图所示，在我们查找距离为 4 的点的时候，我们就能找到目标维修店，那么我们可以认定，起最短距离就是 4。