JavascriptでDateを使用して、先史時代の日付を表示するには?
質問
JavaScriptのDateが十分に大きくないプロジェクトに取り組んでいます。
複数のイベントを同じ時間軸に配置したいのですが、月と日があるものとないものがあり、年だけというのは選択肢にありません。月着陸とビッグバンを同じ軸に配置できるようにしたいのですが。
既存のDateオブジェクトが持っている機能を利用できれば、とても助かるのですが。それは 270,000 年前までしかさかのぼりませんが、私はビッグバン (13,800,000,000 年前) までさかのぼる必要があります。日付に秒やミリ秒を含む必要はありません。
そのような日付の表現を含むように Date オブジェクトを拡張するにはどうすればよいですか?
私は、このためのライブラリまたはネイティブ関数を見つけようとしましたが、うまくいきませんでした。また、私が修正できる Date オブジェクトの JavaScript 実装を探し始めましたが、ここでもうまくいきませんでした。
更新しました。
私はremdevtecのソリューションから始めましたが、最終的にはかなり修正しました。私は、日付のソートと順序付けを容易にするために、日付が数字順になるようにしたかったのです。
そこで私が行ったことは、年が-100,000より前であれば、ミリ秒の値を時間として扱うということでした。これは今のところ私が得たもので、私たちのプロジェクトでは動作しますが、もっと時間があれば、これをきれいにして github に置くつもりです。
function BigDate(date){
if(!date){
this.original = new Date();
}else if(date instanceof BigDate){
this.original = date.original;
}else{
this.original = new Date(date);
}
this.yearBreakpoint = -100000;
this.breakPoint = Date.UTC(this.yearBreakpoint,0,0).valueOf();
this.factor = 360000;//needed for our project to make extra space on our axis
}
BigDate.UTC = function (year, month, day, hour, minute, second, millisecond) {
var temp = new BigDate();
if(year < -temp.yearBreakpoint){
temp.setUTCFullYear(year);
return temp;
}else{
temp.original = Date.UTC(year,month,day,hour,minute,second,millisecond);
}
return temp.valueOf();
};
BigDate.now = function (){
var temp = new BigDate();
temp.original = Date.now();
return temp.valueOf();
};
BigDate.parse = function (val){
throw "not implemnted";
};
//custom functions
BigDate.prototype.getUTCDate = function () {
if(this.valueOf() < this.breakPoint){
return 0;
}
return this.original.getUTCDate();
};
BigDate.prototype.getUTCDay = function () {
if(this.valueOf() < this.breakPoint){
return 0;
}
return this.original.getUTCDay();
};
BigDate.prototype.getUTCFullYear = function () {
if(this.valueOf() < this.breakPoint){
return (this.valueOf() - this.breakPoint) / this.factor;
}
return this.original.getUTCFullYear();
};
BigDate.prototype.getUTCHours = function () {
if(this.valueOf() < this.breakPoint){
return 0;
}
return this.original.getUTCHours();
};
BigDate.prototype.getUTCMilliseconds = function () {
if(this.valueOf() < this.breakPoint){
return 0;
}
return this.original.getUTCMilliseconds();
};
BigDate.prototype.getUTCMinutes = function () {
if(this.valueOf() < this.breakPoint){
return 0;
}
return this.original.getUTCMinutes();
};
BigDate.prototype.getUTCMonth = function () {
if(this.valueOf() < this.breakPoint){
return 0;
}
return this.original.getUTCMonth();
};
BigDate.prototype.getUTCSeconds = function () {
if(this.valueOf() < this.breakPoint){
return 0;
}
return this.original.getUTCSeconds();
};
BigDate.prototype.setUTCDate = function (val) {
if(val >= this.yearBreakpoint){
return this.original.setUTCDate(val);
}
};
BigDate.prototype.setUTCFullYear = function (val) {
if(val < this.yearBreakpoint){
this.original.setTime((parseInt(val) * this.factor) + this.breakPoint);
}else{
this.original.setUTCFullYear(val);
}
return this.valueOf();
};
BigDate.prototype.setUTCHours = function (val) {
if(val >= this.yearBreakpoint){
return this.original.setUTCHours(val);
}
};
BigDate.prototype.setUTCMilliseconds = function (val) {
if(val >= this.yearBreakpoint){
return this.original.setUTCMilliseconds(val);
}
};
BigDate.prototype.setUTCMinutes = function (val) {
if(val >= this.yearBreakpoint){
return this.original.setUTCMinutes(val);
}
};
BigDate.prototype.setUTCMonth = function (val) {
if(val >= this.yearBreakpoint){
return this.original.setUTCMonth(val);
}
};
BigDate.prototype.setUTCSeconds = function (val) {
if(val >= this.yearBreakpoint){
return this.original.setUTCSeconds(val);
}
};
BigDate.prototype.setTime = function (val) {
this.original.setTime(val);
return this.valueOf();
};
BigDate.prototype.valueOf = function () {
return this.original.valueOf();
};
BigDate.prototype.toDateString = function () {
if(this.valueOf() < this.breakPoint){
return "Jan 01 " + this.getUTCFullYear();
}
return this.original.toDateString();
};
BigDate.prototype.toISOString = function () {
if(this.valueOf() < this.breakPoint){
return this.getUTCFullYear() + "-01-01T00:00:00.000Z";
}
return this.original.toISOString();
};
BigDate.prototype.toJSON = function () {
throw "not implemnted";
};
BigDate.prototype.toLocaleDateString = function () {
throw "not implemnted";
};
BigDate.prototype.toLocaleTimeString = function () {
throw "not implemnted";
};
BigDate.prototype.toLocaleString = function () {
throw "not implemnted";
};
BigDate.prototype.toTimeString = function () {
throw "not implemnted";
};
BigDate.prototype.toUTCString = function () {
if(this.valueOf() < this.breakPoint){
return "01 Jan "+ this.getFullYear() +" 00:00:00 GMT";
}
return this.original.toUTCString();
};
/**
* Don't need no timezones
*/
BigDate.prototype.getDate = function () {
return this.getUTCDate();
};
BigDate.prototype.getDay = function () {
return this.getUTCDay();
};
BigDate.prototype.getFullYear = function () {
return this.getUTCFullYear();
};
BigDate.prototype.getHours = function () {
return this.getUTCHours();
};
BigDate.prototype.getMilliseconds = function() {
return this.getUTCMilliseconds();
};
BigDate.prototype.getMinutes = function() {
return this.getUTCMinutes();
};
BigDate.prototype.getMonth = function () {
return this.getUTCMonth();
};
BigDate.prototype.getSeconds = function () {
return this.getUTCSeconds();
};
BigDate.prototype.getTimezoneOffset = function () {
return 0;
};
BigDate.prototype.getTime = function () {
return this.valueOf();
};
BigDate.prototype.setDate = function (val) {
return this.setUTCDate(val);
};
BigDate.prototype.setFullYear = function (val) {
return this.setUTCFullYear(val);
};
BigDate.prototype.setHours = function (val) {
return this.setUTCHours(val);
};
BigDate.prototype.setMilliseconds = function (val) {
return this.setUTCMilliseconds(val);
};
BigDate.prototype.setMinutes = function (val) {
return this.setUTCMinutes(val);
};
BigDate.prototype.setMonth = function (val) {
return this.setUTCMonth(val);
};
BigDate.prototype.setSeconds = function (val) {
return this.setUTCSeconds(val);
};
BigDate.prototype.toString = function () {
return this.toUTCString();
};
どのように解決するのですか?
<ブロッククオート日付に秒やミリ秒は必要ないのですが。
グレゴリオ暦は400年周期、つまり24万年周期で動いていることに注意してください。したがって、60000ミリ秒の表現である
Date
の60000ミリ秒の表現を、240000年周期(最大60000年周期)で遡ることができるのです。これによって、約一年前の
紀元前144億年
(ビッグバンの直前) まで遡ることができます。
以下の例は、Dateオブジェクトのすべての機能を考慮しているわけではありません。しかし、さらに実装を進めれば、同様の機能を持たせることは可能だと思います。例えば、BigDateを1つ。
x
は別のBigDateより大きい。
y
である場合、両方の日付が
AC
であり
x.original > y.original
または
x.isAC()
しかし
!y.isAC()
である場合、または両方の日付が
BC
であり、どちらかが
x.getFullYear() < y.getFullYear()
または
x.getFullYear() === y.getFullYear() && x.original > y.original
.
BigDateの使い方。
var time = new Date (
[year /*range: 0-239999*/],
[month /*range: 0-11*/],
[day of month /*range: 1-31*/],
[hours /*range: 0-23*/],
[minutes /*range: 0-59*/],
[a factor of 240,000,000 years to go back (from the first parameter year) /*range: 0-59*/],
[a factor of 240,000 years to go back (from the first parameter year) /*range: 0-999*/]);
var bigDate = new BigDate(time);
HTML
<span id="years"></span>
<span id="months"></span>
<span id="date"></span>
<span id="hours"></span>
<span id="minutes"></span>
<span id="acbc"></span>
JAVASCRIPT
function BigDate (date) { this.original = date; }
// set unchanged methods,
BigDate.prototype.getMinutes = function () { return this.original.getMinutes(); }
BigDate.prototype.getHours = function () { return this.original.getHours(); }
BigDate.prototype.getDate = function () { return this.original.getDate(); }
BigDate.prototype.getMonth = function () { return this.original.getMonth(); }
// implement other BigDate methods..
そして、お肉の登場です。
// now return non-negative year
BigDate.prototype.getFullYear = function () {
var ms = this.original.getSeconds() * 1000 + this.original.getMilliseconds();
if (ms === 0) return this.original.getFullYear();
else return (ms * 240000) - this.original.getFullYear();
}
// now add AC/BC method
BigDate.prototype.isAC = function () {
var result = this.original.getSeconds() === 0 &&
this.original.getMilliseconds() === 0;
return result;
}
いくつかのデモ(同様に
BigDate.prototype.toString()
など):
var years = document.getElementById("years");
var months = document.getElementById("months");
var date = document.getElementById("date");
var hours = document.getElementById("hours");
var minutes = document.getElementById("minutes");
var acbc = document.getElementById("acbc");
// SET A TIME AND PRESENT IT
var time = new Date (2016, 1, 28, 8, 21, 20, 200);
var bigDate = new BigDate(time);
var monthsName = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
years.innerHTML = bigDate.getFullYear();
months.innerHTML = monthsName[bigDate.getMonth()];
date.innerHTML = bigDate.getDate();
hours.innerHTML = bigDate.getHours() + ":";
minutes.innerHTML = bigDate.getMinutes();
acbc.innerHTML = (bigDate.isAC()) ? "AC":"BC";
結果として得られるコンテンツは次のようになります。
4847996014 Jan 28 8: 21 BC
ここで JSFiddle .
明確化
(正当な)デザインコメントについてですが、私は
BigDate
オブジェクトは、貧弱なインターフェイスとデザインを示しています。このオブジェクトは
例として提示されているだけです。
であり、質問を満たすために秒とミリ秒の未使用の情報を消費しています。この例がテクニックを理解するのに役立つことを願っています。
関連
-
[解決済み] 配列から特定の項目を削除するにはどうすればよいですか?
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] JavaScriptで文字列が部分文字列を含むかどうかを確認する方法は?
-
[解決済み] あるJavaScriptファイルを他のJavaScriptファイルにインクルードするにはどうすればよいですか?
-
[解決済み] JavaScriptの日付の書式設定方法
-
[解決済み] JavaScriptで現在の日付を取得するには?
-
[解決済み】オブジェクトからプロパティを削除する(JavaScript)
-
[解決済み] jqueryでdivの要素がオーバーフローしていないかチェックする
-
[解決済み] AJAX Mailchimp サインアップフォームの統合
-
[解決済み] Javascript の parseInt() で先頭のゼロを削除する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] ExtJS 4のイベントハンドリングについて
-
[解決済み] 兄弟ノードを選択する方法はありますか?
-
[解決済み] JavaScriptで:hoverのCSSプロパティを変更する
-
[解決済み] TypeScriptプロジェクトで既存のC#クラス定義を再利用する方法
-
[解決済み] Reactメモを使うべきではない場合とは?
-
[解決済み] JavaScriptでjson-objectのキーを取得する [重複].
-
[解決済み] CORS: 認証モードは 'include' です。
-
[解決済み] JavaScriptのArray.sort()メソッドでシャッフルするのは正しいのか?
-
[解決済み] javascriptのキャンバスで画像をリサイズする (スムーズ)
-
[解決済み] JavaScriptデータフォーマット/プリティプリンタ