笨办法，先保存用着

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. 网络流24题——分配问题 luogu 4014

    题目链接:这里 本题是一个典型的费用流问题,可以作为费用流建图模板使用 首先看到,每个人只能做一件工作,每件工作只能做一次,一个人做某件工作有一定的收益 那么我们建立一个超级源点st和超级终点ed,然 ...

  2. java请求参数转换

    public class HttpServletRequestUtil { //转换请求参数 public static int getInt(HttpServletRequest request, ...

  3. 关于input的检验问题

    写了很多小应用 但是 对于input有很多 相同的需求 在这里做一个总结 将用的多的校验方法 封装为方法 使用 1.只能输入正整数的校验 输入的时候同时校验 将字符类型的全部替换为空 <inpu ...

  4. 手动部署 kubernetes HA 集群

    前言 关于kubernetes HA集群部署的方式有很多种(这里的HA指的是master apiserver的高可用),比如通过keepalived vip漂移的方式.haproxy/nginx负载均 ...

  5. Monolog手册参考

    https://api.kdyby.org/namespace-Monolog.Handler.html

  6. pycharm中replace的应用

    name = "sucanji" v = name.replace("s","L") print(v) #输出结果就是把sucanji中的s ...

  7. Android 控件

    1. WebView <uses-permission android:name="android.permission.INTERNET" /> WebView wv ...

  8. Python中的作用域及global用法

    Python 中,一个变量的作用域总是由在代码中被赋值的地方所决定的. 函数定义了本地作用域,而模块定义的是全局作用域. 如果想要在函数内定义全局作用域,需要加上global修饰符. 变量名解析:LE ...

  9. 2018.我的NOIP补全计划

    code: efzoi.tk @ shleodai noip2011 D1 选择客栈 这道题是一道大水题,冷静分析一会就会发现我们需要维护最后一个不合法点和前缀和. 维护最后一个不合法点只要边扫描边维 ...

  10. 英语口语练习系列-C38-颜色-谈论日常活动

    词汇颜色 color red passion green peace energy blue calm purple mystery yellow royal 询问日常生活 When do you g ...