echarts读取不到服务器上的.gexf文件

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/xzymmd/article/details/81057332

今天做echarts,始终get不到gexf文件,一直加载loading,通过新学习了用chrome的开发者工具(F12)调试,刷新网页,点击Network,看请求的les-miserables.gexf的内容发现乱码,看到错误出现在引入的.js文件,回到html上查找引入的.js

1.thinkphp引入路径的问题,这个一定要注意:

<script type="text/javascript" src="lib/Js/Jquery/jquery.js"></script>

<script type="text/javascript" src="lib/Js/echarts.js"></script>

<script type="text/javascript" src="lib/Js/dataTool.min.js"></script>

注:lib是我放在当前路径下的文件夹,里面放有.js,所以在thinkphp下找不到,查找我的thinkphp存放.js文件的路径,

进行修改之后

<script type="text/javascript" src="__PUBLIC__/Js/Jquery/jquery.js"></script>

<script type="text/javascript" src="__PUBLIC__/Js/echarts.js"></script>

<script type="text/javascript" src="__PUBLIC__/Js/dataTool.min.js"></script>

就找到了这些.js。

2.$.get('path',callback,'xml')中path不正确

之前我写的是./data/les-miserables.gexf,data也是放在我当前路径下的文件夹,但是请求不到

然后修改为http://211.65.193.55/echarts/les-miserables1.gexf即请求到了。

错误源代码

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>通信关系图</title>
</head>
<body>


<?php header("Content-Type:text/xml; charset=utf-8");?>



	<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM -->
	<div id="graph" style="height: 1000px;"></div>
	<script type="text/javascript" src="lib/echarts.min.js"></script>
	<script type="text/javascript" src="lib/dataTool.min.js"></script>
	<script type="text/javascript" src="lib/jquery-3.2.1.min.js"></script>
	<script type="text/javascript">
	var myChart = echarts.init(document.getElementById('graph'));

	// 显示加载数据中样式
	myChart.showLoading();
	$(function() {
	// 基于准备好的dom,初始化echarts实例	
	// 获取xml
	$.get('./data/les-miserables.gexf', function (xml) {
		// 隐藏加载数据中样式
	    myChart.hideLoading();

	    // 解析转换xml
	    var graph = echarts.dataTool.gexf.parse(xml);

 	    var categories = [];
	
	categories[0] = {
            name: '211.65.193.193' 
        };

        categories[1] = {
            name: '211.65.197.210' 
        };

        categories[2] = {
            name: '202.112.23.167' 
        };

        categories[3] = {
            name: '211.65.192.172' 
        };

        categories[4] = {
            name: '211.65.193.193对端' 
        };

	    categories[5] = {
            name: '211.65.197.210对端' 
        };

        categories[6] = {
            name: '202.112.23.167对端' 
        };

        categories[7] = {
            name: '211.65.192.172对端' 
        };

        categories[8] = {
            name: '交叉节点' 
        }; 

        categories[9] = {
            name: '1.2.3.4对端地址' 
        };


	    graph.nodes.forEach(function (node) {
	        node.itemStyle = null;
	        node.value = node.symbolSize;
	        node.symbolSize /= 1.5;
	        node.label = {
	            normal: {
	                show: node.symbolSize > 5 //什么条件显示圆圈的名字
	            }
	        };
	       node.category = node.attributes.modularity_class;
	    });

		// 打印graph对象
	    //debugger
	    console.log(graph)

	    // 指定图表的配置项和数据
	    var option = {
	        title: {
	            text: '目标IP地址通信活动关系图',
	            subtext: 'Circular layout',
	            top: 'bottom',
	            left: 'right'
	        },
	        tooltip: {
	        	
	        },
	       /*  legend: [{
	            //selectedMode: 'single',
					data: categories.map(function (a) {
	                return a.name;
	            })
	        }], */
	        animationDurationUpdate: 1500,
	        animationEasingUpdate: 'quinticInOut',
	        series : [
	            {
	                name: '通信节点',
	                type: 'graph',
	                layout: 'circular',
	                circular: {
	                    rotateLabel: true
	                },
	                data: graph.nodes,
	                links: graph.links,
	                categories: categories,
	                roam: true,
	                label: {
	                    normal: {
	                        position: 'right',
	                        formatter: '{b}'
	                    }
	                },
	                lineStyle: {
                    normal: {
                        color: 'source',
                        curveness: 0.3
                    }
                }
            }
        ]
    };

	    //使用刚指定的配置项和数据显示图表。
	    myChart.setOption(option);
	}, 'xml');

	$(window).resize(myChart.resize.bind(myChart))
})
	</script>
</body>
</html>

修改之后的源代码

<script type="text/javascript" src="__PUBLIC__/Js/Jquery/jquery.js"></script>
<script type="text/javascript" src="__PUBLIC__/Js/echarts.js"></script>
<script type="text/javascript" src="__PUBLIC__/Js/dataTool.min.js"></script>
<script type="text/javascript">
	$(function() {
	// 基于准备好的dom,初始化echarts实例
	var myChart = echarts.init(document.getElementById('relate_graph'));
 
	// 显示加载数据中样式
	myChart.showLoading();
    
	// 获取xml
	$.get('http://211.65.193.55/echarts/les-miserables1.gexf', function (xml) {
	//http://211.65.193.55/echarts/les-miserables1.gexf
		// 隐藏加载数据中样式
	    myChart.hideLoading();

	    // 解析转换xml
	    var graph = echarts.dataTool.gexf.parse(xml);
		if(!graph)
		{document.write("1111");}
        
 	    var categories = [];
	
	categories[0] = {
            name: '211.65.193.193' 
        };

        categories[1] = {
            name: '211.65.197.210' 
        };

        categories[2] = {
            name: '202.112.23.167' 
        };

        categories[3] = {
            name: '211.65.192.172' 
        };

        categories[4] = {
            name: '211.65.193.193对端' 
        };

	    categories[5] = {
            name: '211.65.197.210对端' 
        };

        categories[6] = {
            name: '202.112.23.167对端' 
        };

        categories[7] = {
            name: '211.65.192.172对端' 
        };

        categories[8] = {
            name: '交叉节点' 
        }; 

        categories[9] = {
            name: '1.2.3.4对端地址' 
        };


	    graph.nodes.forEach(function (node) {
	        node.itemStyle = null;
	        node.value = node.symbolSize;
	        node.symbolSize /= 1.5;
	        node.label = {
	            normal: {
	                show: node.symbolSize > 5 //什么条件显示圆圈的名字
	            }
	        };
	        node.category = node.attributes.modularity_class;
	    });

		// 打印graph对象
	    //debugger
	    console.log(graph)

	    // 指定图表的配置项和数据
	    var option = {
	        title: {
	            text: '目标IP地址通信活动关系图',
	            subtext: 'Circular layout',
	            top: 'bottom',
	            left: 'right'
	        },
	        tooltip: {
	        	
	        },
	      //  legend: [{
	            //selectedMode: 'single',
	        //    data: categories.map(function (a) {
	         //       return a.name;
	        //    })
	       // }], 
	        animationDurationUpdate: 1500,
	        animationEasingUpdate: 'quinticInOut',
	        series : [
	            {
	                name: '通信节点',
	                type: 'graph',
	                layout: 'circular',
	                circular: {
	                    rotateLabel: true
	                },
	                data: graph.nodes,
	                links: graph.links,
	                categories: categories,
	                roam: true,
	                label: {
	                    normal: {
	                        position: 'right',
	                        formatter: '{b}'
	                    }
	                },
	                lineStyle: {
                    normal: {
                        color: 'source',
                        curveness: 0.3
                    }
                }
            }
        ]
    };

	    //使用刚指定的配置项和数据显示图表。
	    myChart.setOption(option);
	}, 'xml');

	$(window).resize(myChart.resize.bind(myChart))
})
	</script>




展开阅读全文

J2ME读取不到文件

04-11

我想用J2ME写一个选择本地txt文件读取的功能rnrn为什么在虚拟机上面就是读不到文件(没有真机)?rnrn文件目录如下rn[img=https://img-bbs.csdn.net/upload/201404/11/1397176650_538711.png][/img]rn[code=java]rnpackage com.zemo.test;rnrnimport java.io.IOException;rnimport java.util.Enumeration;rnrnimport javax.microedition.io.Connector;rnimport javax.microedition.io.file.FileConnection;rnimport javax.microedition.io.file.FileSystemRegistry;rnimport javax.microedition.lcdui.Alert;rnimport javax.microedition.lcdui.AlertType;rnimport javax.microedition.lcdui.Command;rnimport javax.microedition.lcdui.CommandListener;rnimport javax.microedition.lcdui.Display;rnimport javax.microedition.lcdui.Displayable;rnimport javax.microedition.lcdui.Image;rnimport javax.microedition.lcdui.List;rnimport javax.microedition.midlet.MIDletStateChangeException;rnrnpublic class FileBrowser extends List implements CommandListenerrnrn public static final Command SELECT_FILE_COMMAND = new Command("选择", Command.OK, 1);rn private String currDirName;rn private String currFile;rn private Image dirIcon;rn private Image fileIcon;rn private CommandListener commandListener;rn rn private static final String UP_DIRECTORY = "..";rn private static final String MEGA_ROOT = "/";rn private static final String SEP_STR = "/";rn private static final char SEP = '/';rn rn private Display display;rn private String selectedURL;rn private String filter = null;rn private String title;rn rn public FileBrowser(Display display) rn super("文件浏览", IMPLICIT);rn currDirName = MEGA_ROOT;rn this.display = display;rn super.setCommandListener(this);rn setSelectCommand(SELECT_FILE_COMMAND);rn try rn dirIcon = Image.createImage(this.getClass().getResourceAsStream("/file.png"));rn catch (IOException e) rn dirIcon = null;rn e.printStackTrace();rn rn try rn fileIcon = Image.createImage(this.getClass().getResourceAsStream("/book.png"));rn catch (IOException e) rn fileIcon = null;rn e.printStackTrace();rn rn showDir();rn rnrn /**rn * 显示当前文件夹rn */rn private void showDir() rn new Thread(new Runnable() rn public void run() rn try rn showCurrDir();rn catch (SecurityException e) rn Alert alert = new Alert("错误","您没有权限访问此文件或文件夹!",null,AlertType.ERROR);rn alert.setTimeout(2000);rn display.setCurrent(alert,FileBrowser.this);rn catch (Exception e) rn e.printStackTrace();rn rn rn ).start();rn rnrn public void commandAction(Command c, Displayable d) rn if (c.equals(SELECT_FILE_COMMAND)) rn List currList = (List) d;rn currFile = currList.getString(currList.getSelectedIndex());rn new Thread(new Runnable() rn rn public void run() rn if (currFile.endsWith(SEP_STR) || currFile.equals(UP_DIRECTORY)) rn openDir(currFile);rn else rn doDismiss();rn rn rn ).start();rn else rn if (commandListener != null) rn commandListener.commandAction(c, d);rn rn rn rn rn public void setTitle(String title)rn this.title = title;rn super.setTitle(title);rn rn rn public void showCurrDir()rn if (title == null) rn super.setTitle(currDirName);rn rn Enumeration enumeration = null;rn FileConnection currDir = null;rn rn deleteAll();rn if (MEGA_ROOT.equals(currDirName)) rn append(UP_DIRECTORY, dirIcon);rn enumeration = FileSystemRegistry.listRoots();rn else rn try rn currDir = (FileConnection) Connector.open("file:///"+currDirName);rn enumeration = currDir.list();rn catch (IOException e) rn e.printStackTrace();rn rn append(UP_DIRECTORY, dirIcon);rn rn if (enumeration == null) rn try rn currDir.close();rn catch (IOException e) rn e.printStackTrace();rn rn return;rn rn while (enumeration.hasMoreElements()) rn String fileName = (String)enumeration.nextElement();rn if (fileName.charAt(fileName.length() - 1) == SEP) rn append(fileName, dirIcon);rn else rn if (filter == null || fileName.indexOf(filter) > -1) rn append(fileName, fileIcon);rn rn rn rn if (currDir != null) rn try rn currDir.close();rn catch (IOException e) rn e.printStackTrace();rn rn rn rn rn private void openDir(String fileName)rn if (currDirName.equals(MEGA_ROOT)) rn if (fileName.equals(UP_DIRECTORY)) rn return;rn rn currDirName = fileName;rn else if(fileName.equals(UP_DIRECTORY))rn int i = currDirName.lastIndexOf(SEP,currDirName.length() -2 );rn if (i != -1) rn currDirName = currDirName.substring(0, i+1);rn else rn currDirName = MEGA_ROOT;rn rn else rn currDirName = currDirName +fileName;rn rn showDir();rn rn rn public FileConnection getSelectedFile() throws IOExceptionrn FileConnection fileConnection = (FileConnection) Connector.open(selectedURL);rn return fileConnection;rn rnrn public String getSelectedFileURL()rn return selectedURL;rn rn rn public void setFilter(String filter)rn this.filter = filter;rn rn rn protected CommandListener getCommandListener() rn return commandListener;rn rn rn public void setCommandListener(CommandListener commandListener)rn this.commandListener = commandListener;rn rn rn public void doDismiss()rn selectedURL = "file:///"+currDirName + currFile;rn CommandListener listener = getCommandListener();rn if (listener != null) rn listener.commandAction(SELECT_FILE_COMMAND, this);rn rn rnrn[/code] 论坛

没有更多推荐了,返回首页