| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 2037 人关注过本帖
标题:想用echarts做个关系图,但苦于不知怎么解释成VFP的,请高手帮帮忙
只看楼主 加入收藏
dglhz
Rank: 2
来 自:东莞南城
等 级:论坛游民
威 望:1
帖 子:13
专家分:60
注 册:2022-5-7
收藏
得分:0 
回复 9楼 plsword
分卷压缩可上传
sbrow.part1.rar (4.8 MB)
sbrow.part2.rar (1.47 MB)
2022-11-22 16:15
schtg
Rank: 12Rank: 12Rank: 12
来 自:Usa
等 级:贵宾
威 望:67
帖 子:1712
专家分:3318
注 册:2012-2-29
收藏
得分:0 
回复 11楼 dglhz
成功,谢谢分享!
2022-11-22 16:35
dglhz
Rank: 2
来 自:东莞南城
等 级:论坛游民
威 望:1
帖 子:13
专家分:60
注 册:2022-5-7
收藏
得分:0 
回复 10楼 shonken
1:使用win10环境,调用edge内核可显示图形,但节点功能不可用
图片附件: 游客没有浏览图片的权限,请 登录注册
图片附件: 游客没有浏览图片的权限,请 登录注册



2:sbrowser 控件功能可正常使用与浏览器中打开无异
图片附件: 游客没有浏览图片的权限,请 登录注册


3:数据集和运行文件直接合并在一个HTML里可以吗?
测试结果:数据集和运行文件直接合并在一个HTML里,浏览器可正常打开
在sbrowser 控件中 loadFile 方法(读磁盘文件)也能正常打开
但loadHtml(读内存字符) 方法则不能显示

2022-11-22 16:41
dglhz
Rank: 2
来 自:东莞南城
等 级:论坛游民
威 望:1
帖 子:13
专家分:60
注 册:2022-5-7
收藏
得分:20 
回复 10楼 shonken
*** sbrowser 合并 ***

LOCAL c11,c12
c11=JUSTPATH(sys(16,0))
c12=( SUBSTR(c11, AT('.CLICK',c11)+7 ))

cdata =FILETOSTR(c12+"\js11.json")
echarts=FILETOSTR(c12+"\echarts.min.js")

TEXT TO cHtml TEXTMERGE NOSHOW PRETEXT 7
<!DOCTYPE html>
<html lang="zh-CN" style="height: 100%">
<head>
  <meta charset="utf-8">
</head>
<body style="height: 100%; margin: 0">
  <div id="container" style="height: 100%"></div>
  <script type="text/javascript">
  <<m.echarts>>
    var graph=<<m.cdata>>  

    var dom = document.getElementById('container');
    var myChart = echarts.init(dom, null, {
      renderer: 'canvas',
      useDirtyRect: false
    });
    var app = {};
    var option;
    myChart.showLoading();   
  myChart.hideLoading();
  graph.nodes.forEach(function (node) {
    node.label = {
      show: node.symbolSize > 30
    };
  });
  option = {
    title: {
      text: 'Les Miserables',
      subtext: 'Default layout',
      top: 'bottom',
      left: 'right'
    },
    tooltip: {},
    legend: [
      {
        // selectedMode: 'single',
        data: graph.categories.map(function (a) {
          return a.name;
        })
      }
    ],
    animationDuration: 1500,
    animationEasingUpdate: 'quinticInOut',
    series: [
      {
        name: 'Les Miserables',
        type: 'graph',
        layout: 'none',
        data: graph.nodes,
        links: graph.links,
        categories: graph.categories,
        roam: true,
        label: {
          position: 'right',
          formatter: '{b}'
        },
        lineStyle: {
          color: 'source',
          curveness: 0.3
        },
        emphasis: {
          focus: 'adjacency',
          lineStyle: {
            width: 10
          }
        }
      }
    ]
  };
  myChart.setOption(option);
    if (option && typeof option === 'object') {
      myChart.setOption(option);
    }

    window.addEventListener('resize', myChart.resize);
  </script>
</body>
</html>
ENDTEXT
Strtofile(cHtml,c12+"\RelationshipChart2.html")
Thisform.wb.loadFile(c12+"\RelationshipChart2.html")
*Thisform.wb.loadHtml(cHtml)

[此贴子已经被作者于2022-11-22 16:53编辑过]

2022-11-22 16:41
shonken
Rank: 2
等 级:论坛游民
帖 子:116
专家分:26
注 册:2017-1-15
收藏
得分:0 
以下是引用dglhz在2022-11-22 16:41:48的发言:

*** sbrowser 合并 ***

LOCAL c11,c12
c11=JUSTPATH(sys(16,0))
c12=( SUBSTR(c11, AT('.CLICK',c11)+7 ))

cdata =FILETOSTR(c12+"\js11.json")
echarts=FILETOSTR(c12+"\echarts.min.js")
TEXT TO cHtml TEXTMERGE NOSHOW PRETEXT 7
<!DOCTYPE html>
<html lang="zh-CN" style="height: 100%">
<head>
  <meta charset="utf-8">
</head>
<body style="height: 100%; margin: 0">
  <div id="container" style="height: 100%"></div>
  <script type="text/javascript">
  <<m.echarts>>
    var graph=<<m.cdata>>  
    var dom = document.getElementById('container');
    var myChart = echarts.init(dom, null, {
      renderer: 'canvas',
      useDirtyRect: false
    });
    var app = {};
    var option;
    myChart.showLoading();   
  myChart.hideLoading();
  graph.nodes.forEach(function (node) {
    node.label = {
      show: node.symbolSize > 30
    };
  });
  option = {
    title: {
      text: 'Les Miserables',
      subtext: 'Default layout',
      top: 'bottom',
      left: 'right'
    },
    tooltip: {},
    legend: [
      {
        // selectedMode: 'single',
        data: graph.categories.map(function (a) {
          return a.name;
        })
      }
    ],
    animationDuration: 1500,
    animationEasingUpdate: 'quinticInOut',
    series: [
      {
        name: 'Les Miserables',
        type: 'graph',
        layout: 'none',
        data: graph.nodes,
        links: graph.links,
        categories: graph.categories,
        roam: true,
        label: {
          position: 'right',
          formatter: '{b}'
        },
        lineStyle: {
          color: 'source',
          curveness: 0.3
        },
        emphasis: {
          focus: 'adjacency',
          lineStyle: {
            width: 10
          }
        }
      }
    ]
  };
  myChart.setOption(option);
    if (option && typeof option === 'object') {
      myChart.setOption(option);
    }

    window.addEventListener('resize', myChart.resize);
  </script>
</body>
</html>
ENDTEXT
Strtofile(cHtml,c12+"\RelationshipChart2.html")
Thisform.wb.loadFile(c12+"\RelationshipChart2.html")
*Thisform.wb.loadHtml(cHtml)


实在太感谢你了,代码及测试,尤其是分享了控件,以后图表可以展示得更生动了,谢谢你
2022-11-22 19:46
shonken
Rank: 2
等 级:论坛游民
帖 子:116
专家分:26
注 册:2017-1-15
收藏
得分:0 
以下是引用dglhz在2022-11-22 16:41:48的发言:
在sbrowser 控件中 loadFile 方法(读磁盘文件)也能正常打开
但loadHtml(读内存字符) 方法则不能显示


我将之前生成的雷达图,用SBrowswe的loadFile和loadHtml都不能显示,但EDGE浏览器显示却没问题,这个是什么原因?
RadarChart.zip (1002 Bytes)
2022-11-22 20:43
dglhz
Rank: 2
来 自:东莞南城
等 级:论坛游民
威 望:1
帖 子:13
专家分:60
注 册:2022-5-7
收藏
得分:0 
图片附件: 游客没有浏览图片的权限,请 登录注册

图片附件: 游客没有浏览图片的权限,请 登录注册
2022-11-23 03:18
shonken
Rank: 2
等 级:论坛游民
帖 子:116
专家分:26
注 册:2017-1-15
收藏
得分:0 
以下是引用dglhz在2022-11-23 03:18:19的发言:

终于找到原因,是那个斜杠的问题,我原来的路径变量是带斜杠的,似乎必须在路径变量后加上斜杠。然后有些图表是只能用loadFile来运行,有些只能用loadHtml来运行,不知有什么规律
  
        <script type="text/javascript" src="<<c12>>\echarts.min.js"></script>


[此贴子已经被作者于2022-11-23 13:18编辑过]

2022-11-23 13:10
dglhz
Rank: 2
来 自:东莞南城
等 级:论坛游民
威 望:1
帖 子:13
专家分:60
注 册:2022-5-7
收藏
得分:0 
loadHtml 定义加载运行文件需要指定路径,这种方法测试时相对稳定.
 loadFile 理论上不用指定路径,测试上面的 RadarChart.html 有时可正常显示,有时不能显示,可能是测试时调用不同路径的测试文件, 怀疑是缓存的冲突,但找不到消除缓存的可靠方法,只是在浏览中消除缓存,然后关闭vfp,过5-10分钟后再启动vfp,运行测试 loadFile 的方法,这时又会神奇的正常了.

或者编译成exe 后,运行不会出现这种现象.


[此贴子已经被作者于2022-11-23 19:06编辑过]

2022-11-23 19:04
shonken
Rank: 2
等 级:论坛游民
帖 子:116
专家分:26
注 册:2017-1-15
收藏
得分:0 
以下是引用dglhz在2022-11-23 19:04:33的发言:

 loadHtml 定义加载运行文件需要指定路径,这种方法测试时相对稳定.
 loadFile 理论上不用指定路径,测试上面的 RadarChart.html 有时可正常显示,有时不能显示,可能是测试时调用不同路径的测试文件, 怀疑是缓存的冲突,但找不到消除缓存的可靠方法,只是在浏览中消除缓存,然后关闭vfp,过5-10分钟后再启动vfp,运行测试 loadFile 的方法,这时又会神奇的正常了.

或者编译成exe 后,运行不会出现这种现象.


我将项目编译成exe后,可以显示图表,但SBrowser控件不刷新数据,浏览器显示没问题。
我模拟了些数据集文件在压缩包里,如果有空帮忙测试下,HTML有没有刷新数据的语句,不知跟这个有没有关系

程序代码:
<script type="text/javascript" src="D:\TEMP\HUMAINES_SQL\echarts.min.js"></script>
<script type="text/javascript" src="D:\TEMP\HUMAINES_SQL\DataSet.json"></script>
<script type="text/javascript">


RelationshipChart3 (1).zip (4.38 KB)

(之前上传的附件,数据上有重复的地方,图表会不显示,已更正)

[此贴子已经被作者于2022-11-25 16:04编辑过]

2022-11-25 10:43
快速回复:想用echarts做个关系图,但苦于不知怎么解释成VFP的,请高手帮帮忙
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.030689 second(s), 9 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved