笨办法，先保存用着

unit Unit1;

interface

uses

  Winapi.Windows, Winapi.Messages, System.SysUtils, System.Variants, System.Classes,

  Vcl.Graphics, Vcl.Controls, Vcl.Forms, Vcl.Dialogs, Data.DB, DBAccess, Vcl.Menus,

  System.Actions, Vcl.ActnList, Vcl.StdCtrls, Vcl.OleCtrls, SHDocVw, Vcl.AppEvnts,

  Uni;

type

  TForm1 = class(TForm)

    WebBrowser1: TWebBrowser;

    btnShowEcharts: TButton;

    ApplicationEvents1: TApplicationEvents;

    procedure btnShowEchartsClick(Sender: TObject);

    procedure WebBrowser1DocumentComplete(ASender: TObject; const pDisp: IDispatch; const URL: OleVariant);

    procedure ApplicationEvents1Message(var Msg: tagMSG; var Handled: Boolean);

  private

    { Private declarations }

  public

    { Public declarations }

  end;

var

  Form1: TForm1;

implementation

uses

  DataModule;

{$R *.dfm}

var

  PathStr: string;

//屏蔽右键

procedure TForm1.ApplicationEvents1Message(var Msg: tagMSG; var Handled: Boolean);

begin

  with Msg do

  begin

    if not IsChild(WebBrowser1.Handle, hwnd) then

      Exit;

    Handled := (message = WM_RBUTTONDOWN) or (message = WM_RBUTTONUP) or (message = WM_CONTEXTMENU);

  end;

end;

//生成并显示图表

procedure TForm1.btnShowEchartsClick(Sender: TObject);

var

  str, strSql: TStringList;

  strSPMC, strSL: string;

  qryDT: TUniQuery;

  i: Integer;

begin

  str := TStringList.Create;

  strSql := TStringList.Create;

  qryDT := TUniQuery.Create(Self);

  try

    if DataModule2.UniConnection1.Connected then

      qryDT.Connection := DataModule2.UniConnection1;

    strSql.Add('SELECT s.SPMC,SUM(SL)SL FROM QDDBDMX AS q ');

    strSql.Add('LEFT JOIN SHANGPIN AS s ON s.SPDM=q.SPDM ');

    strSql.Add('WHERE s.BYZD8=''2019''');

    strSql.Add('GROUP BY s.SPMC');

    with qryDT do

    begin

      Close;

      SQL.text := strSql.Text;

      Open;

    end;

    qryDT.First;

    for i :=  to qryDT.RecordCount -  do

    begin

      strSPMC := strSPMC + '"' + qryDT.FieldByName('SPMC').Value + '"';

      strSL := strSL + IntToStr(qryDT.FieldByName('SL').Value);

      if i = qryDT.RecordCount -  then

      begin

        strSPMC := strSPMC;

        strSL := strSL;

      end

      else

      begin

        strSPMC := strSPMC + ',';

        strSL := strSL + ',';

      end;

      qryDT.Next;

    end;

    str.add('<!DOCTYPE html> ');

    str.add('<html> ');

    str.add('<head> ');

    str.add('    <meta http-equiv="content-type" content="text/html;charset=gb2312"> ');

    str.add('    <title>ECharts</title> ');

    str.add('    <!-- 引入 echarts.js --> ');

    str.add('    <script src="https://cdn.bootcss.com/echarts/4.1.0-release/echarts.min.js"></script> ');

    str.add('</head> ');

    str.add('<body> ');

    str.add('    <!-- 为ECharts准备一个具备大小（宽高）的Dom --> ');

    str.add('    <div id="main" style="width: 1000px;height:400px;"></div> ');

    str.add('    <script type="text/javascript"> ');

    str.add('        // 基于准备好的dom，初始化echarts实例 ');

    str.add('        var myChart = echarts.init(document.getElementById(''main'')); ');

    str.add(' ');

    str.add('        // 指定图表的配置项和数据 ');

    str.add('        var option = { ');

    str.add('            title: { ');

    str.add('                text: ''类别销售对比''');

    str.add('            }, ');

    str.add('            tooltip: {}, ');

    str.add('            legend: { ');

    str.add('                data:[''销量'']');

    str.add('            }, ');

    str.add('            xAxis: { ');

    str.add('                data: [' + strSPMC + '] ');

    str.add('            }, ');

    str.add('            yAxis: {}, ');

    str.add('            series: [{ ');

    str.add('                name: ''品类'', ');

    str.add('                type: ''bar'', ');

    str.add('                data: [' + strSL + '] ');

    str.add('            }] ');

    str.add('        }; ');

    str.add(' ');

    str.add('        // 使用刚指定的配置项和数据显示图表。 ');

    str.add('        myChart.setOption(option); ');

    str.add('    </script> ');

    str.add('</body> ');

    str.add('</html>');

  //生成并保存网页

    PathStr := ExtractFilePath(Application.ExeName) + 'index.html';

    str.SaveToFile(PathStr);

  //加载本地网页

    WebBrowser1.Navigate(ExtractFileDir(ParamStr()) + '\index.html');

  finally

    str.Free;

    strSql.Free;

    qryDT.Free;

  end;

end;

//网页加载完毕

procedure TForm1.WebBrowser1DocumentComplete(ASender: TObject; const pDisp: IDispatch; const URL: OleVariant);

begin

  //隐藏滚动条

  WebBrowser1.oleobject.Document.body.Scroll := 'no';

  WebBrowser1.oleobject.Document.documentElement.style.overflow := 'hidden';

  //删除文件

  DeleteFile(PathStr);

end;

end.

效果

Delphi窗体显示Echarts图表的更多相关文章

  1. ECharts图表tooltip显示时超出canvas图层解决方法

    我们在做ECharts图表的时候可能会遇到tooltip显示时超出了canvas图层范围,并且被其它z-index较高的div容器遮盖,这是悬浮展示信息就看不全,我们根据官网文档的配置项查询发现con ...

  2. ECharts图表插件(4.x版本)使用（一、关系图force节点显示为自定义图像/图片，带分类选择）

    导读 ECharts,一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safar ...

  3. echarts之bootstrap选项卡不能显示其他标签echarts图表

    在echarts跟bootstrap选项卡整合的时候,默认第一个选中选项卡可以正常加载echarts图表,但是切换其他选项的时候不能渲染出其他选项卡echarts图表. 解决方法: 在js中添加代码: ...

  4. C#WinForm应用程序中嵌入ECharts图表

    C#WinForm应用程序中嵌入ECharts图表 程序运行效果: 下载ECharts: 官网下载ECharts :http://echarts.baidu.com/download.html 或者直 ...

  5. echarts图表第一个案例

    1.action中获取到数据 @Override public String execute() throws Exception { List<Student> find = echar ...

  6. echarts图表标签（axisLabel）折行

    在项目中遇到了一个echarts图表标签过长需折行的需求,so引出这篇总结,啦啦啦有帮助就多多支持啦,撒花撒花撒花~~~~ 在此不对echarts其他用法做解释,详细见echarts文档(点击前往) ...

  7. ECharts图表中级入门之formatter：夜谈关于ECharts图表内的数据格式化方法

    来源于:http://www.ithao123.cn/content-3751220.html 格式化之所以存在,主要是因为我们想把一些不够人性化的内容通过某种处理让其变得人性化,便于用户更好地理解内 ...

  8. Echarts图表控件使用总结2(Line，Bar)—问题篇

    Echarts图表控件使用总结1(Line,Bar):http://www.cnblogs.com/hanyinglong/p/Echarts.html 1.前言 a.前两天简单写了一篇在MVC中如何 ...

  9. Delphi窗体创建释放过程及单元文件小结（转）

    Delphi窗体创建释放过程及单元文件小结 Delphi中的窗体,有模式窗体与非模式窗体两种.两种窗体的调用方式不同,模式窗体使用ShowModal显示,非模式窗体使用Show显示.当显示模式窗体的时 ...

随机推荐

  1. windows端口并结束其进程

  2. 调用脚本的方式自动的创建或者是更新oracle数据库自带的Seq序列号的值

    执行脚本: CREATE OR REPLACE PACKAGE PKG_QUERY IS -- Author : ADMINISTRATOR -- Created : 2016/12/8 星期四 10 ...

  3. 二阶环路滤波器的matlab 设计

    clc; Rs=10*10^6; %码速率 es=0.707; %阻尼系数 fs=8*10^6; %采样频率.系统时钟频率 Bit_Loop_out=27;%环路滤波器输入输出位宽 N=31; %NC ...

  4. IntelliJ IDEA运行eclipse的web项目报错的问题

    用IDEA已经有一段时间了, 由于之前的IDEA版本不支持Tomcat服务器, 所以很长一段时间web项目都是由eclipse开发调试. 今天闲来无事下载了一个最新版的IDEA, 按网上的教程, 尝试 ...

  5. python 列表 元组 字符串

    列表添加: list.append() list.extend() list.insert() 列表删除: list.remove()   #删除某一个元素 list.pop()  #删除某一个返回删 ...

  6. ASP.NET 多环境下配置文件web.config的灵活配置

    调试,发布Asp.net程序的时候,开发环境和发布环境的Web.Config往往不同,比如connectionstring等.如果常常有调试,发布的需求,就需要常常修改web.config文件,这往往 ...

  7. 常用的js正则验证整理

    一.校验数字的js正则表达式 1 数字:^[0-9]*$ 2 n位的数字:^\d{n}$ 3 至少n位的数字:^\d{n,}$ 4 m-n位的数字:^\d{m,n}$ 5 零和非零开头的数字:^(0| ...

  8. python全栈开发day112-CBV、flask_session、WTForms

    1.Flask 中的 CBV class Index(views.MethodView): # methods = ["POST"] # decorators = [war,nei ...

  9. python3.7 打包成exe程序（只需两行命令）

    根据博客作者louniuous的python3.7 打包成exe的一种方法 pyinstaller一文改编简化 环境:pycharm2018.1+win7+python3.7 工具:pyinstall ...

  10. exit（）

    exit()通常是用在子程序中用来终结程序用的,使用后程序自动结束,跳回操作系统. exit(0) 表示程序正常退出,exit⑴/exit(-1)表示程序异常退出. exit() 结束当前进程/当前程 ...