skyfffire
/
ticker_viewer


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
							use std::fs::File;
use std::io::Write;
use handlebars::Handlebars;
use rust_decimal::Decimal;
use tracing::info;

#[allow(dead_code)]
//生成html
pub fn export_html(title: &str, symbol: &str, x_values: Vec<Decimal>, y_values: Vec<Decimal>) {
    info!("正在生成网页，请稍候……");
    let path = format!("./新版无敌大数据ticker {}.html", symbol);
    // 创建 Handlebars 实例
    let mut handlebars = Handlebars::new();

    let data = serde_json::json!({
        "chart_title": format!("新版无敌大数据Ticker {}的{}", title, symbol),
        "x_values": x_values,
        "y_values": y_values,
    });
    // HTML 模板
    let template = r#"
        <!DOCTYPE html>
        <html>
        <head>
            <meta charset="UTF-8">
            <title>{{chart_title}}</title>
            <script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/5.4.3/echarts.min.js"></script>
            <script src="https://cdnjs.cloudflare.com/ajax/libs/dayjs/1.11.10/dayjs.min.js"></script>

            <style>
                * {
                    margin: 0;
                    padding: 0;
                }
                #main {
                    margin: 50px auto 0;
                    width: calc(100vw - 100px);
                    height: calc(100vh - 100px);
                }
                .info_wp{
                    padding: 0 40px;
                }
            </style>
        </head>
        <body>
            <div id="main"></div>
            <div class="info_wp">{{statistic_result}}</div>
        </body>
        <script>
            var exchangeColor = {binance: '#F4BC0C', gate: '#0068FF', okx: '#171F30'};
            var chartDom = document.getElementById('main');
            var myChart = echarts.init(chartDom);
            var option;

            option = {
              title: {
                text: '{{chart_title}}'
              },
              tooltip: {
                trigger: 'axis',
                axisPointer: {
                  type: 'cross',
                  lineStyle: {
                      type: 'dashed',
                      width: 1
                  }
                },
                formatter: function (value) {
                  let time = dayjs(value[0].name *1).format('YYYY-MM-DD HH:mm:ss.SSS');
                  let price = value[0].value;
                  return `时间：${time}<br/>价格：${price}`
                },
              },
              toolbox: {
                feature: {
                  brush: {
                    type: ['rect', 'clear']
                  }
                }
              },
              dataZoom: [
                {
                    type: 'inside',
                    start: 0,
                    end: 100
                },
                {
                    start: 0,
                    end: 100
                }
              ],
              legend: {
                   data: {{x_values}}
              },
              xAxis: {
                type: 'category',
                boundaryGap: false,
                data: {{x_values}},
                show : false
              },
              yAxis: {
                type: 'value',
                boundaryGap: [0, '100%'],
                formatter: function (value) {
                  return dayjs(value[0].name *1).format('YYYY-MM-DD HH:mm:ss.SSS');
                },
              },
              series: [
                {
                  name: '价格',
                  type: 'line',
                  symbol: 'none',
                  sampling: 'lttb',
                  itemStyle: {
                    color: 'rgb(55, 162, 255)'
                  },
                  areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                      {
                        opacity: 0.4,
                        offset: 0,
                        color: 'rgb(55, 162, 255)'
                      },
                      {
                        opacity: 0.1,
                        offset: 1,
                        color: 'rgb(55, 162, 255)'
                      }
                    ])
                  },
                  data: {{y_values}}
                }
              ]
            };

            option && myChart.setOption(option);
            </script>
        </html>
    "#;

    // 编译模板
    handlebars
        .register_template_string("page", template)
        .expect("编译模版失败！");

    // 渲染模板
    let output = handlebars
        .render("page", &data)
        .expect("渲染模版失败！");

    // 将 HTML 写入文件
    let mut file = File::create(&path).expect("创建文件失败！");
    file.write_all(output.as_bytes()).expect("写入文件到本地失败！");
    info!("Analyze信息网页生成成功!路径：{:?}\n\n", path);
}