Hacktoberfest 2026：メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

Mermaid zoom-in/zoom-out button?

オープン
  • 何か問題がありますか？
#292 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
62/100
issue の種類
機能追加
明瞭さ
おおむね明確
活発さ
静か
技術スタック
react, typescript
領域
frontend

調査の方向性

Start by locating how Mermaid diagrams are rendered in the React markdown preview and review any existing preview controls. Add discoverable zoom-in and zoom-out controls for long Mermaid diagrams, then verify the behavior with the example diagram in this issue and confirm the controls work without disrupting normal preview rendering.

索引モデルが issue の本文から書いたものです。

説明

Currently, I have a long mermaid which doesn't read well unless you use zoom-in/zoom-out.

For example,

Mermaid Diagram

flowchart TD
    A["Leaked X DM offer<br/>simple influencer pitch"] -->|"turns DMs into paid distribution"| B["Geo-arbitrage pricing<br/>localized rate, global reach"]
    B -->|"lowers CAC through PPP leverage"| C["Influencer army<br/>12 quote-tweets per month"]
    C -->|"repeats the same platform signal"| D["Manufactured network effect<br/>trend appearance and social proof"]
    D -->|"converts trust into gambling users"| E["Gambling economics<br/>LTV must beat tweet cost"]
    E -->|"keeps the acquisition loop profitable"| F["Growth loop<br/>DMs keep coming"]

    A1["Can pay u $1,000 a month"] --> A
    A2["Ask: 12 quote-tweets"] --> A
    A3["Leaked messages reveal strategy"] --> A
    A4["Kalshi slides into X DMs"] --> A

    B1["Roughly $83 per tweet"] --> B
    B2["Purchasing Power Parity (PPP)"] --> B
    B3["Dollar strong in targeted demographics"] --> B
    B4["X timeline has global reach"] --> B
    B5["Localized rate for global asset"] --> B
    B6["Lower Customer Acquisition Cost (CAC) drastically"] --> B

    C1["Universal army of promoters"] --> C
    C2["Steep discount"] --> C
    C3["Badges next to blue tick"] --> C
    C4["Tech influencer in developing nation"] --> C
    C5["Significant salary, often more than rent money"] --> C

    D1["Monday: coding tips"] --> D
    D2["Tuesday: generational wealth on prediction markets"] --> D
    D3["Influencers secure the bag"] --> D
    D4["Platforms buy trust at scale"] --> D
    D5["Amrit promotes Kalshi"] --> D
    D6["Aditya promotes Kalshi"] --> D
    D7["Algorithm sees a trend"] --> D
    D8["User sees social proof"] --> D
    D9["Reality: bought on a payroll"] --> D

    E1["Product is gambling"] --> E
    E2["Gambling is a universal human behavior"] --> E
    E3["Desire to wager on outcomes"] --> E
    E4["LTV exceeds $83 tweet cost"] --> E
    E5["Math holds up"] --> E

    F -.->|"profitable tweets fund more DMs"| A
    D -.->|"more posts create more social proof"| C
    C -.->|"repeated virality attracts platform growth"| F

So I'd love controls like you see on Github Preview or maybe just zoom-in/zoom-out.

主要言語
TypeScript
スター
350
フォーク
54
30日以内にマージされた PR はありません

環境構築

このプロジェクトには開発コンテナ、Dockerfile、コントリビューションガイドがありません。まず README を読み、一般的な手順ははじめてのコントリビューションガイドを参照してください。

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

uiwjs/react-markdown-preview のほかの issue

uiwjs/react-markdown-preview の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。