About

数にまつわる面白い事実を返してくれる Open API です. ダミーテキストとして使ったり, モックアプリ開発などに便利です.

• Numbers API
• mduan/numbers_api: API for querying interesting information about different numbers

Demo

デモです. ajax 経由で Numbers API からデータを引っ張ってきています. 更新するたびに内容が変わります.

Usage

Options

ベースとなる URL は下記

http://numbersapi.com/number/type

• number ... 数字を指定
  • 数字 ... 5 や 2016 など
  • 日付 ... month/day(9/16, 3/16 など)
  • random ... ランダムな数字が指定される
  • 範囲指定 ... min..max or ,(1..3, 0..12,16 など)
• type ... タイプを指定
  • trivia(default) ... 数字にまつわるトリビア
  • math ... 数字の数学にまつわること
  • date ... 日付にまつわること
  • year ... 年にまつわること

JavaScrpit(jQuery)

jQuery で取得する方法です.

$.get('http://numbersapi.com/random/trivia', function(res) {
  $('#numbers').html(res);
});

Examples

6 にまつわるトリビア

http://numbersapi.com/6

2016 年にまつわること

http://numbersapi.com/2016/year

ランダムな数字の数学にまつわること

http://numbersapi.com/random/math

1~100 までの数字にまつわるトリビア

http://numbersapi.com/1..100/trivia

JSONP で使う方法です.

query に callback='関数名' を指定するとリクエスト完了時にその関数が呼ばれます.

下記のように関数化しておくと使いまわせて便利ですよ♪

window.onload = function() {  
  jsonp('42', 'trivia', 'showNumber');
};

var showNumber = function(res) {  
  document.querySelector('#numbers').innerHTML = res;
};

var jsonp = function(num, type, callbackName) {  
  var scriptTag = document.createElement('script');
  scriptTag.async = true;
  scriptTag.src = ['http://numbersapi.com', num, type].join('/') + '?' + 'callback=' + callbackName;
  document.body.appendChild(scriptTag);
};

runstant

Usage with Vue.js

vue.js と一緒に使ってみました.