The avatar for @harada32
yusaku harada
Published
Edited
May 8, 2020
Fork of d3.format
1 star
Insert cell
Insert cell
d3.format(".1f")(0.1 + 0.2) // fixed decimal
Insert cell
d3.format(".2f")(0.1 + 0.2) // fixed decimal
Insert cell
d3.format(".3f")(0.1 + 0.2) // fixed decimal
Insert cell
Insert cell
d3.format(".0%")(0.123) // rounded percentage
Insert cell
d3.format(".1%")(0.123) // rounded percentage
Insert cell
Insert cell
d3.format("$.2f")(-3.5) // localized fixed-point currency
Insert cell
d3.format("$.2f")(-3.521) // localized fixed-point currency
Insert cell
d3.format("($.1f")(-3.5) // localized fixed-point currency
Insert cell
d3.format("($")(-3.5) // localized fixed-point currency
Insert cell
d3.format("($.2f")(2.5) // localized fixed-point currency
Insert cell
md`"20"で左側にその数字分のスペースを作ってくれています。`
Insert cell
d3.format("20")(42) // space-filled and signed
Insert cell
d3.format("10")(42) // space-filled and signed
Insert cell
Insert cell
d3.format("+0")(42) // space-filled and signed
Insert cell
d3.format("0")(-42) // space-filled and signed
Insert cell
d3.format("+0")(-42) // space-filled and signed
Insert cell
d3.format("0")(42) // space-filled and signed
Insert cell
Insert cell
d3.format(".^20")(42) // dot-filled and centered
Insert cell
d3.format(".^10")(42) // dot-filled and centered
Insert cell
d3.format(".20")(42) // dot-filled and centered
Insert cell
d3.format("t^20")(42) // dot-filled and centered
Insert cell
d3.format("2^20")(42) // dot-filled and centered
Insert cell
Insert cell
d3.format(".2s")(42e6) // SI-prefix with two significant digits
Insert cell
d3.format(".2s")(42e12) // SI-prefix with two significant digits
Insert cell
d3.format("s")(421213e6) // SI-prefix with two significant digits
Insert cell
d3.format(".11s")(421223313e6) // SI-prefix with two significant digits
Insert cell
Insert cell
d3.format("#x")(48879) // prefixed lowercase hexadecimal
Insert cell
d3.format("#x")(479) // prefixed lowercase hexadecimal
Insert cell
d3.format("#x")(4883479) // prefixed lowercase hexadecimal
Insert cell
Insert cell
d3.format(",.2r")(4223) // grouped thousands with two significant digits
Insert cell
d3.format(",r")(4223) // grouped thousands with two significant digits
Insert cell
d3.format(",.1r")(4223) // grouped thousands with two significant digits
Insert cell
d3.format(",.2")(4223) // grouped thousands with two significant digits
Insert cell
d3.format(",r")(42232323) // grouped thousands with two significant digits
Insert cell
d3.format(",")(4221212123) // grouped thousands with two significant digits
Insert cell
Insert cell
d3.format("s")(1500)
Insert cell
d3.format("s")(150012)
Insert cell
d3.format("s")(15)
Insert cell
md`~をつけると、６桁以下で最後が０なら省いてくれます。`
Insert cell
d3.format("~s")(1500)
Insert cell
d3.format("~s")(112020)
Insert cell
d3.format("s")(1502323)
Insert cell
d3.format("~s")(15023223000)
Insert cell
d3.format("s")(15023223000)
Insert cell
d3.format(".2s")(15001100)
Insert cell
Insert cell
d3.format("~g")(423232442424)
Insert cell
d3.format(",g")(4123512451452)
Insert cell
d3.format("n")(422)
Insert cell
d3.format("")(4322)
Insert cell
d3.format(".2")(42)
Insert cell
d3.format(".2")(4.2)
Insert cell
d3.format(".1")(42)
Insert cell
d3.format(".1")(4.2)
Insert cell
Insert cell
d3.format("$<7")(1500); // "1.50000k"
Insert cell
d3.format("^20")(1500); // "1.50000k"
Insert cell
d3.format(";=20")(1500); // "1.50000k"
Insert cell
d3.format("$>20")(1500); // "1.50000k"
Insert cell
d3.format("20")(1500); // "1.50000k"
Insert cell
d3.format("-=30")(1500); // "1.50000k"
Insert cell
d3.format("(")(-1500); // "1.50000k"
Insert cell
d3.format("-")(-1500); // "1.50000k"
Insert cell
d3.format(" ")(0); // "1.50000k"
Insert cell
d3.format(" ")(2); // "1.50000k"
Insert cell
d3.format(" ")(-3); // "1.50000k"
Insert cell
d3.format("+")(0); // "1.50000k"
Insert cell
d3.format("0")(1500000000230); // "1.50000k"
Insert cell
d3.format("")(1500000000320); // "1.50000k"
Insert cell
d3.format("0")(15343043); // "1.50000k"
Insert cell
d3.format("10")(1500); // "1.50000k"
Insert cell
d3.format("23")(1500); // "1.50000k"
Insert cell
d3.format("2")(1500); // "1.50000k"
Insert cell
d3.format("5")(-10); // "1.50000k"
Insert cell
d3.format(",")(150423420); // "1.50000k"
Insert cell
d3.format("")(1500); // "1.50000k"
Insert cell
d3.format("")(1500); // "1.50000k"
Insert cell
d3.format("")(1500); // "1.50000k"
Insert cell
d3.format("")(1500); // "1.50000k"
Insert cell
d3.format("")(1500); // "1.50000k"
Insert cell
d3.format("e")(1500);//指数表記
Insert cell
d3.format("f")(1500);//固定小数点、小数点以下有効数字６桁
Insert cell
d3.format("f")(150012.12);
Insert cell
d3.format("g")(150);//小数表記か、指数表記だが６桁以上は四捨五入される。
Insert cell
d3.format("s")(1512032120);//６桁の数値をメガ、ギガなど使い（0-999）＋（K,M,G,T）というふうにしてくれる。
Insert cell
d3.format("%")(0.23);//×100した後、％をつける。桁数が多い。
Insert cell
d3.format("~%")(0.43);//
Insert cell
d3.format("p")(0.15);
Insert cell
d3.format("b")(1500);
Insert cell
d3.format("o")(1500);
Insert cell
d3.format("d")(1500);
Insert cell
d3.format("x")(1500);
Insert cell
d3.format("c")(1500);//文字列に変換
Insert cell
d3.format(",~f")(1521323232323413200);//大きな数値をそのまま表記したい時
Insert cell
d3.format(",~s")(150232323323242120);
Insert cell
d3.format("-^30,~f")(1121212500);
Insert cell
Insert cell
f = d3.formatPrefix(",.0", 1e-6)
Insert cell
f(0.00042)
Insert cell
f(0.0042)
Insert cell
f2 = d3.formatPrefix(",.0", 1e9)
Insert cell
f2(1212121212212)
Insert cell
f3 = d3.formatPrefix(",.0", 1e-3)
Insert cell
f3(0.101)
Insert cell
Insert cell
s = Object.assign(d3.formatSpecifier("f"), {precision: d3.precisionFixed(0.01)})
Insert cell
d3.format(s)(42)
Insert cell
Insert cell
new d3.FormatSpecifier({type: "s"})
Insert cell
Insert cell
d3 = require("d3-format@1")
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more