Как и многие другие люди я решил заработать на курсе Bitcoin зарегистрировался на бирже и купил альтернативные криптовалюты. Что бы высчитывать выгодный курс для покупки или продажи составил калькулятор.
Данные он берёт по клику кнопки в режиме реального времени с сайта https://coinmarketcap.com/
jquery ajax $.get — Загружает данные с сервера при помощи HTTP GET запроса. Получает данные в формате JSON.
В интернете предлагали множество способов и все они подразумевали обработку на стороне сервера. Я нашёл вариант с обработкой из браузера. Как и полагается JavaScript файлам.
Пример документации с сайта:
Endpoint: /ticker/
Method: GET
Optional parameters:
(int) start — return results from rank [start] and above
(int) limit — return a maximum of [limit] results (default is 100, use 0 to return all results)
(string) convert — return price, 24h volume, and market cap in terms of another currency. Valid values are:
«AUD», «BRL», «CAD», «CHF», «CLP», «CNY», «CZK», «DKK», «EUR», «GBP», «HKD», «HUF», «IDR», «ILS», «INR», «JPY», «KRW», «MXN», «MYR», «NOK», «NZD», «PHP», «PKR», «PLN», «RUB», «SEK», «SGD», «THB», «TRY», «TWD», «ZAR»
Пример №1
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
[ { "id": "bitcoin", "name": "Bitcoin", "symbol": "BTC", "rank": "1", "price_usd": "573.137", "price_btc": "1.0", "24h_volume_usd": "72855700.0", "market_cap_usd": "9080883500.0", "available_supply": "15844176.0", "total_supply": "15844176.0", "percent_change_1h": "0.04", "percent_change_24h": "-0.3", "percent_change_7d": "-0.57", "last_updated": "1472762067" }, { "id": "ethereum", "name": "Ethereum", "symbol": "ETH", "rank": "2", "price_usd": "12.1844", "price_btc": "0.021262", "24h_volume_usd": "24085900.0", "market_cap_usd": "1018098455.0", "available_supply": "83557537.0", "total_supply": "83557537.0", "percent_change_1h": "-0.58", "percent_change_24h": "6.34", "percent_change_7d": "8.59", "last_updated": "1472762062" }, ... ] |
Пример №2 Боевой.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
[ { "id": "ripple", "name": "Ripple", "symbol": "XRP", "rank": "3", "price_usd": "0.606269", "price_btc": "0.00007825", "24h_volume_usd": "490570000.0", "market_cap_usd": "23700095880.0", "available_supply": "39091716516.0", "total_supply": "99992497246.0", "max_supply": "100000000000", "percent_change_1h": "0.54", "percent_change_24h": "-9.85", "percent_change_7d": "-25.35", "last_updated": "1521376441" } ] |
К сожалению мои познания в области функций на JavaScript не так велики, так что стиль написания более процедурный с соответствующими повторами кода. Хотелось быстрее написать калькулятор, осуществить свою задумку. Но главное, никакого сервера, всё исполняется из обычного файлика html.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="jquery-3.2.1.min.js"></script> <script> $(function() { $('#Ripple').click(function () { $.get( "https://api.coinmarketcap.com/v1/ticker/ripple/", function( data ) { $( "body" ) .append( "<br>name: " + data[0]["name"] ) .append( "<br>symbol: " + data[0]["symbol"] ) .append( "<br>price_usd: " + data[0]["price_usd"] ) .append( "<br>price_btc: " + data[0]["price_btc"] ) }, "json" ); $.get( "https://api.coinmarketcap.com/v1/ticker/ripple/", function( data ) { $( "#in1" ).val(data[0]["price_btc"]) .append( "<br>price_btc: " + data[0]["price_btc"] ) }, "json" ); $.get( "https://api.coinmarketcap.com/v1/ticker/bitcoin/", function( data ) { $( "#bitCoinPrice" ).val(data[0]["price_usd"]) .text( "<br>price_btc: " + data[0]["price_btc"] ) }, "json" ); }); }); $(function() { $('#IOTA').click(function () { $.get( "https://api.coinmarketcap.com/v1/ticker/iota/", function( data ) { $( "body" ) .append( "<br>name: " + data[0]["name"] ) .append( "<br>symbol: " + data[0]["symbol"] ) .append( "<br>price_usd: " + data[0]["price_usd"] ) .append( "<br>price_btc: " + data[0]["price_btc"] ) }, "json" ); $.get( "https://api.coinmarketcap.com/v1/ticker/iota/", function( data ) { $( "#in1" ).val(data[0]["price_btc"]) .text( "<br>price_btc: " + data[0]["price_btc"] ) }, "json" ); $.get( "https://api.coinmarketcap.com/v1/ticker/bitcoin/", function( data ) { $( "#bitCoinPrice" ).val(data[0]["price_usd"]) .append( "<br>price_btc: " + data[0]["price_btc"] ) }, "json" ); }); }); $(function() { $('#Cardano').click(function () { $.get( "https://api.coinmarketcap.com/v1/ticker/cardano/", function( data ) { $( "body" ) .append( "<br>name: " + data[0]["name"] ) .append( "<br>symbol: " + data[0]["symbol"] ) .append( "<br>price_usd: " + data[0]["price_usd"] ) .append( "<br>price_btc: " + data[0]["price_btc"] ) }, "json" ); $.get( "https://api.coinmarketcap.com/v1/ticker/cardano/", function( data ) { $( "#in1" ).val(data[0]["price_btc"]) .text( "<br>price_btc: " + data[0]["price_btc"] ) }, "json" ); $.get( "https://api.coinmarketcap.com/v1/ticker/bitcoin/", function( data ) { $( "#bitCoinPrice" ).val(data[0]["price_usd"]) .append( "<br>price_btc: " + data[0]["price_btc"] ) }, "json" ); }); }); $(function() { $('#pow2').click(function () { var bitCoinPrice,someone,fee,itog,kzm,prsnt25,prsnt100,prsntM25,prsntM100,feeDel; someone = document.getElementById("bitCoinPrice").value; kzm = document.getElementById("kzm").value; fee = document.getElementById("in1").value.replace(/,/, '.'); //заменить запятую на точку fee = fee.replace(/ /g,""); //удалить пробелы itog = parseFloat(someone*fee); itogKZM = itog.toFixed(2)*kzm; feeDel = fee; prsnt25 = parseFloat(fee*20/100); prsnt25 += parseFloat(fee); prsnt100 = parseFloat(fee*100/100); prsnt100 += parseFloat(fee); // // prsntM25 = parseFloat(feeDel/2 + feeDel/4); prsntM25 = parseFloat(feeDel-(feeDel/5)); //Находим 20% prsntM100 = parseFloat(feeDel/2); // prsntM100 += parseFloat(feeDel); //alert(typeof prsnt25);//31745 $('#kzmOut').val(itogKZM.toFixed(2)+"$"); $('#vivodin1').val(itog.toFixed(2)+"$"); $('#prsnt25').val(prsnt25.toFixed(8)); $('#prsnt100').val(prsnt100.toFixed(8)); $('#prsntM25').val(prsntM25.toFixed(8)); $('#prsntM100').val(prsntM100.toFixed(8)); }); }); </script> <style> table td { padding: 0px 30px; vertical-align: bottom; } </style> </head> <body> <table> <tr> <td><button id="Ripple">Курс Ripple</button></td> <td><button id="IOTA">Курс IOTA</button></td> <td><button id="Cardano">Курс Cardano</button></td> </tr> </table> <table> <tr> <td><p>Цена Биткоина<br>(Напр.:20000)</p><input type="text" id="bitCoinPrice" value="13000"></td> </tr> <tr> <td><p>Цена валюты в Биткоинах<br>(Напр.:0.00025396)</p><input type="text" id="in1" value=""></td><!-- 0.00025396 --> <td><p>Количество закупленных монет</p><input type="text" id="kzm" value="1"></td> <td><p>Цена ордера на продажу<br>+20% к стоимости</p><input type="text" id="prsnt25"></td> <td><p>Цена ордера на покупку<br>-25% к стоимости</p><input type="text" id="prsntM25"></td> </tr> <tr> <td><p>Цена валюты за единицу в долларах </p><input type="text" id="vivodin1"></td> <td><p>Общая цена закупленных монет</p><input type="text" id="kzmOut"></td> <td><p>Цена ордера на продажу<br>+100% к стоимости</p><input type="text" id="prsnt100"></td> <td><p>Цена ордера на покупку<br>-50% к стоимости</p><input type="text" id="prsntM100"></td> </tr> <tr> <td></td> <td><button id="pow2">Посчитать</button></td> <td></td> </tr> </table> <script> function idealMid() { var hPrc,lPrc,mid,hPrc2,lPrc2,mid2; hPrc = document.getElementById("hPrc").value.replace(/,/, '.'); //заменить запятую на точку lPrc = document.getElementById("lPrc").value.replace(/,/, '.'); //заменить запятую на точку //fee = fee.replace(/ /g,""); //удалить пробелы mid = (parseFloat(hPrc)+parseFloat(lPrc))/2; $('#mid').val(mid.toFixed(8)); } </script> <table> <tr> <td><p>Самая высокая цена<br>(Напр.:0.00095396)</p></td> <td><input type="text" id="hPrc" value="0.00095396"></td> </tr> <tr> <td><p>Самая низкая цена<br>(Напр.:0.00025396)</p></td> <td><input type="text" id="lPrc" value="0.00025396"></td> </tr> <tr> <td><p>Идеальная средняя</p></td> <td><input type="text" id="mid"></td> </tr> </table> <button onclick="idealMid()">Посчитать</button> <ul> <li>Удалите пробелы</li> <li>Удалите вместо запятых ставьте точки</li> </ul> </body> </html> |
| Категория: JavaScript
| Тэги: $.get