Editing HTML-Crypto-Currency-Chart-Snippets/README.md at master · AYIDouble/HTML-Crypto-Currency-Chart-Snippets · GitHub

PHOTO

Thu Dec 01 2022 13:17:42 GMT+0000 (Coordinated Universal Time)

Saved by @maja_arsovska #undefined

# 💹 HTML Crypto Currency Chart Snippets 💹

💹 Simple HTML Snippets to create Tickers / Charts of Cryptocurrencies with the TradingView API 💹



## [💹 Candlestick Chart with Indicators 💹](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Chart)



![Crypto Currency Chart Cryptocurrencies Candle Candlestick with indicators TradingView API RSI Stoch](Images/Chart.png)



```

<div class="tradingview-widget-container">

  <div id="tradingview_7"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/BITFINEX-IOTUSD/" rel="noopener" target="_blank"><span class="blue-text">IOTUSD Chart</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>

  <script type="text/javascript">

  new TradingView.widget(

  {

  "autosize": true,

  "symbol": "BINANCE:IOTAUSD",

  "interval": "D",

  "timezone": "Europe/Zurich",

  "theme": "Dark",

  "style": "1",

  "locale": "en",

  "toolbar_bg": "#f1f3f6",

  "enable_publishing": false,

  "hide_side_toolbar": false,

  "allow_symbol_change": true,

  "studies": [

    "RSI@tv-basicstudies",

    "StochasticRSI@tv-basicstudies"

  ],

  "container_id": "tradingview_048"

}

  );

  </script>

</div>

```



## [💲 Crypto Currency Ticker 💲](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Ticker)


40
![Crypto Currency Ticker Cryptocurrencies Chart TradingView API](Images/Crypto-Ticker.png)



```

<div class="tradingview-widget-container">

  <div class="tradingview-widget-container__widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com" rel="noopener" target="_blank"><span class="blue-text">Quotes</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-tickers.js" async>

  {
48
  "symbols": [

    {

      "description": "",

      "proName": "COINBASE:BTCUSD"

    },

    {

      "description": "",

      "proName": "COINBASE:ETHUSD"

    },

    {

      "description": "",

      "proName": "BINANCE:IOTAUSD"

    }

  ],

  "colorTheme": "dark",

  "isTransparent": false,

  "locale": "en"

}

  </script>

</div>

```



## [💲 Crypto Currency Ticker Tape 💲](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Ticker-Tape)



![Crypto Currency Ticker Cryptocurrencies Chart TradingView API](Images/Crypto-Currency-Ticker.png)


74
```

<div class="tradingview-widget-container">

  <div class="tradingview-widget-container__widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com" rel="noopener" target="_blank"><span class="blue-text">Ticker Tape</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-ticker-tape.js" async>

  {

  "symbols": [

    {

      "description": "",

      "proName": "COINBASE:BTCUSD"

    },

    {

      "description": "",

      "proName": "COINBASE:ETHUSD"

    },

    {

      "description": "",

      "proName": "BINANCE:IOTAUSD"

    }

  ],

  "colorTheme": "dark",

  "isTransparent": false,

  "displayMode": "adaptive",

  "locale": "en"

}

  </script>

</div>

```



## [💹 Mini Chart 💹](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Mini-Chart)



![Crypto Currency Mini Chart Cryptocurrencies TradingView API](Images/Mini-Chart.png)



```

<div class="tradingview-widget-container">

  <div class="tradingview-widget-container__widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/BITFINEX-IOTUSD/" rel="noopener" target="_blank"><span class="blue-text">IOTUSD Rates</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-mini-symbol-overview.js" async>

  {

  "symbol": "BINANCE:IOTAUSD",

  "width": "100%",

  "height": "100%",

  "locale": "en",

  "dateRange": "12m",

  "colorTheme": "dark",

  "trendLineColor": "rgba(, , 244, 1)",

  "underLineColor": "rgba(, 218, 248, 0.15)",

  "isTransparent": false,

  "autosize": true,

  "largeChartUrl": ""

}

  </script>

</div>

```



## [💹 Overview Chart 💹](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Overview-Chart)



![Crypto Currency Overview Chart Cryptocurrencies Chart TradingView API](Images/Overview-Chart.png)



```

<div class="tradingview-widget-container">

  <div id="tv-medium-widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/COINBASE-BTCUSD/" rel="noopener" target="_blank"><span class="blue-text">BTC</span></a>, <a href="https://www.tradingview.com/symbols/COINBASE-ETHUSD/" rel="noopener" target="_blank"><span class="blue-text">ETH</span></a> <span class="blue-text">and</span> <a href="https://www.tradingview.com/symbols/BITFINEX-IOTUSD/" rel="noopener" target="_blank"><span class="blue-text">IOT Quotes</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>

  <script type="text/javascript">

  new TradingView.MediumWidget(

  {

  "container_id": "tv-medium-widget",

  "symbols": [

    [

      "BTC",

      "COINBASE:BTCUSD|12m"

    ],

    [

      "ETH",

      "COINBASE:ETHUSD|12m"

    ],

    [

      "IOT",

      "BINANCE:IOTAUSD|12m"

    ]

  ],

  "greyText": "Quotes by",

  "gridLineColor": "#e9e9ea",

  "fontColor": "#83888D",

  "underLineColor": "#dbeffb",

  "trendLineColor": "#4bafe9",

  "width": "100%",

  "height": "100%",

  "locale": "en"
164
}

  );

  </script>

</div>

```



## [💹 Technical Analysis 💹](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Technical-Analysis)



![Crypto Currency Technical Analysis Cryptocurrencies Symbol TradingView API](Images/Technical-Analysis.png)



```

<div class="tradingview-widget-container">

  <div class="tradingview-widget-container__widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/COINBASE-BTCUSD/technicals/" rel="noopener" target="_blank"><span class="blue-text">Technical Analysis for BTCUSD</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-technical-analysis.js" async>

  {

  "showIntervalTabs": true,

  "width": "100%",

  "colorTheme": "dark",

  "isTransparent": false,

  "locale": "en",

  "symbol": "COINBASE:BTCUSD",

  "interval": "1W",

  "height": "100%"

}

  </script>

</div>

```



## [💲 Single Ticker 💲](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Single-Ticker)
194


![Crypto Currency Single Ticker Cryptocurrencies Bitcoin TradingView API](Images/Single-Ticker.png)



```

<div class="tradingview-widget-container">

  <div class="tradingview-widget-container__widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/COINBASE-BTCUSD/" rel="noopener" target="_blank"><span class="blue-text">BTCUSD Rates</span></a> by TradingView</div>
201
  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-single-quote.js" async>

  {

  "symbol": "COINBASE:BTCUSD",

  "width": "100%",

  "colorTheme": "dark",

  "isTransparent": false,

  "locale": "en"

}

  </script>

</div>

```

https://github.com/AYIDouble/HTML-Crypto-Currency-Chart-Snippets/edit/master/README.md

Save snippets that work from anywhere online with our extensions

Available in the Chrome Web Store

Get Firefox Add-on

Get VS Code extension

Comments

More like this

add property to each object in array javascript using ".map()" Code Example

Results.map(obj=> ({ ...obj, Active: 'false' }))

second child element

<!DOCTYPE html>
<html>
<head>
<style> 
p:nth-child(2) {
  background: red;
}
</style>
</head>
<body>

<p>The first paragraph.</p>
<p>The second paragraph.</p>
<p>The third paragraph.</p>
<p>The fourth paragraph.</p>

<p><b>Note:</b> Internet Explorer 8 and earlier versions do not support the :nth-child() selector.</p>

</body>
</html>

{

  queryArtists(byName:"Red Hot Chili Peppers") {

    name

    id

    image

  }

}

{

  queryArtists(byName:"Red Hot Chili Peppers") {

    name

    id

    image

    albums {

      id

    }

  }

}

full screen search box overlay

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body {
  font-family: Arial;
}

* {
  box-sizing: border-box;
}

.openBtn {
  background: #f1f1f1;
  border: none;
  padding: 10px 15px;
  font-size: 20px;
  cursor: pointer;
}

.openBtn:hover {
  background: #bbb;
}

.overlay {
  height: 100%;
  width: 100%;
  display: none;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
}

.overlay-content {
  position: relative;
  top: 46%;

jQuery Validate - Radio button example

$(function()

  {

    $('#myform').validate(

      {

        rules:

        {

          Color:{ required:true }

        },

        messages:

        {

          Color:

          {

            required:"Please select a Color<br/>"

          }

        },

        errorPlacement: function(error, element) 

        {

            if ( element.is(":radio") ) 

            {

                error.appendTo( element.parents('.container') );

            }

            else 

            { // This is the default behavior 

                error.insertAfter( element );

Dynamically add input box to text

<!DOCTYPE html>
<html>
<body>

<p>Click the button to create a Text Field.</p>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
  var x = document.createElement("INPUT");
  x.setAttribute("type", "text");
  x.setAttribute("value", "Hello World!");
  document.body.appendChild(x);
}
</script>

</body>
</html>

hello world C++

#include <iostream>
using namespace std;

int main() {
  cout << "Hello World!";
  return 0;
}

ES6 Console - try JavaScript compilers

fetch('https://jsonplaceholder.typicode.com/todos/1')
      .then(resultado => {
  	return resultado.json();
})
      .then(resultadoFinal => {
  	console.log(resultadoFinal)
});

.icon-interactive {
	fill: #6A6976;
	fill-rule: evenodd;
	height: 32px;
	width:32px;
	background:none;
	cursor:pointer;
}

.icon-interactive:hover {
	fill: #363545;
	height: 32px;
	width:32px;
	background:#e2e2e7;
	border-radius: 4px;
}

.icon-interactive:active {
	fill: #0D6AA8;
	height: 32px;
	width:32px;
	background:#CFE1EE;
	border-radius: 4px;
	
}

常用的 rclone 命令

rclone config - 以控制会话的形式添加rclone的配置，配置保存在.rclone.conf文件中。
rclone copy - 将文件从源复制到目的地址，跳过已复制完成的。
rclone sync - 将源数据同步到目的地址，只更新目的地址的数据。
rclone move - 将源数据移动到目的地址。
rclone delete - 删除指定路径下的文件内容。
rclone purge - 清空指定路径下所有文件数据。
rclone mkdir - 创建一个新目录。
rclone rmdir - 删除空目录。
rclone check - 检查源和目的地址数据是否匹配。
rclone ls - 列出指定路径下所有的文件以及文件大小和路径。
rclone lsd - 列出指定路径下所有的目录/容器/桶。
rclone lsl - 列出指定路径下所有文件以及修改时间、文件大小和路径。
rclone md5sum - 为指定路径下的所有文件产生一个md5sum文件。
rclone sha1sum - 为指定路径下的所有文件产生一个sha1sum文件。
rclone size - 获取指定路径下，文件内容的总大小。.
rclone version - 查看当前版本。
rclone cleanup - 清空remote。
rclone dedupe - 交互式查找重复文件，进行删除/重命名操作。
 
rclone move Gdrive1:/Private Gdrive2:/Private
or
rclone copy Gdrive1:/SFW Gdrive2:/SFW
or
rclone sync Gdrive1:/NSFW Gdrive2:/NSFW	
 

rclone copy        复制
rclone move        移动，如果要在移动后删除空源目录，加上 --delete-empty-src-dirs 参数
rclone sync        同步：将源目录同步到目标目录，只更改目标目录
rclone size        查看网盘文件占用大小
rclone delete        删除路径下的文件内容
rclone purge        删除路径及其所有文件内容
rclone mkdir        创建目录
rclone rmdir        删除目录
rclone rmdirs        删除指定环境下的空目录。如果加上 --leave-root 参数，则不会删除根目录
rclone check        检查源和目的地址数据是否匹配
rclone ls        列出指定路径下的所有的文件以及文件大小和路径
rclone lsl        比上面多一个显示上传时间
rclone lsd        列出指定路径下的目录
rclone lsf        列出指定路径下的目录和文件

# 复制到网盘，并显示实时传输进度，设置并行上传数为8
 
rclone copy -P /home/SunPma GD:/home/SunPma --transfers=8
 
# 如果需要服务端对服务端的传输可加以下参数（不消耗本地流量）
 
rclone copy 配置名称:网盘路径 配置名称:网盘路径 --drive-server-side-across-configs

rclone 有 4 个级别的日志记录，ERROR，NOTICE，INFO 和 DEBUG。默认情况下，rclone 将生成 ERROR 和 NOTICE 级别消息。

-q - rclone将仅生成 ERROR 消息。
-v - rclone将生成 ERROR，NOTICE 和 INFO 消息，推荐此项。
-vv - rclone 将生成 ERROR，NOTICE，INFO和 DEBUG 消息。
--log-level LEVEL - 标志控制日志级别。

return 2 objects from function typescript Code Example

//function that returns multiple values

function getTopTwoColors() {

    return ["blue", "pink"];

}

var topTwoColors=getTopTwoColors();

var firstValue=topTwoColors[0]; //get first return value

var secondValue=topTwoColors[1]; //get second return value

Damn simple blockquote

@import url(https://fonts.googleapis.com/css?family=Bitter);



* {

  box-sizing: border-box;

}



html {

  text-align: center;

  padding-top: 50px;

  background: url(https://dl.dropbox.com/s/mz2pjouq8xqw45k/wood_1.png?dl=1);

}



blockquote {

  position: relative;

  display: inline-block;

  background: #eee;

  padding: 40px 30px 30px 60px;

  border-radius: 10px;

  font-family: 'Bitter', serif;

  color: #333;

  text-align: left;

  

  box-shadow: 1px 1px 1px #999,

              2px 2px 1px #999,

              3px 3px 1px #999;

  transition-duration: .3s;

Insert Headers and Footers ‹ The edge to Freedom — WordPress

<!-- Facebook Pixel Code -->
<script>
  !function(f,b,e,v,n,t,s)
  {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
  n.callMethod.apply(n,arguments):n.queue.push(arguments)};
  if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
  n.queue=[];t=b.createElement(e);t.async=!0;
  t.src=v;s=b.getElementsByTagName(e)[0];
  s.parentNode.insertBefore(t,s)}(window, document,'script',
  'https://connect.facebook.net/en_US/fbevents.js');
  fbq('init', '766974780896089');
  fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
  src="https://www.facebook.com/tr?id=766974780896089&ev=PageView&noscript=1"
/></noscript>
<!-- End Facebook Pixel Code -->

Browse more snippets >>