本文へ移動

Wakusei Planets惑星

太陽・惑星・衛星を、線画、陰影つきの絵、表面の地図で描きます。実際の大きさ・傾き・自転つきで、任意の日時の衛星の位置も分かります。

「惑星」(わくせい) は、太陽のまわりを回る大きな星のことです。 名前について(英語)

目次

リファレンス · データ・線画・位置

embedCode関数

リファレンスの説明と例は英語です。見出しと目次は日本語です。

The text that puts a body in a page, for one way of making the page. Each way is built, parsed or run by the package's tests: the plain HTML one with a script tag from jsDelivr, an ES module, a React component, a Vue single-file component, an Angular standalone component, a Svelte component, and an iframe of the demo's embed.html.

インポート

import { embedCode } from "@johnmorrisdotca/wakusei-planets";

定義

function embedCode(options: EmbedOptions, kind?: EmbedKind, settings?: EmbedSettings): string

引数

名前型説明
optionsEmbedOptions

The body, its look, the date, the moons, the turn and the size.

kind (省略可)"html" | "iframe" | "module" | "react" | "vue" | "angular" | "svelte"

The way the page is made; html by default.

settings (省略可)EmbedSettings

The CDN and the demo's address, when they are not the package's own.

戻り値

string

The text to paste into the page's source.

例

import { embedCode } from "@johnmorrisdotca/wakusei-planets";

console.log(embedCode({ body: "jupiter", look: "realistic", time: "now", moons: true }, "react"));
import { useEffect } from "react";

export function Planet() {
  useEffect(() => {
    // The element needs a browser, so it is imported in an effect, never at the top of the file.
    void import("@johnmorrisdotca/wakusei-planets/element");
    void import("@johnmorrisdotca/wakusei-planets/jupiter");
  }, []);
  return <wakusei-body body="jupiter" look="realistic" time="now" moons />;
}

出力(このページを作ったときに実行した結果)

ソースを見るGitHub で編集@johnmorrisdotca/wakusei-planets 0.24.0 のソースから作成しました。

この日本語は、まだ日本語を母語とする方の確認を受けていません。訂正を歓迎します。