介绍 & lt; ! DOCTYPE html>
& lt; html>
& lt; head>
& lt; meta charset=皍tf8"祝辞& lt;/meta>
& lt; script src=癶ttp://cdn.bootcss.com/echarts/3.2.2/echarts.js"祝辞& lt;/script>
& lt; script src=癶ttp://lib.sinaapp.com/js/jquery/1.10.2/jquery-1.10.2.min.js"祝辞& lt;/script>
& lt; script 类型=拔谋?javascript"比;
function 才能画(){
,,,var text =, (“# graph-input")美元.val ();
,,,var data =, eval(文本);
,,,var graph =, data2Graph(数据);
,,,drawGraph(图);
,,}
function 才能data2Graph(数据),{
,,,var graph =, {}
,,,var vertices =, {}
,,,var links =, [];
,,,for (var 小姐:=,0;,小姐:& lt;, data.length;,我+ +),{
,,,,,var s =,字符串(数据[我][0]);
,,,,,var t =,字符串(数据[我][1]);
,,,,,var v =,数据[我][2];
,,,,,顶点[s],=,年代;
,,,,,顶点[t],=, t;
,,,,,links.push({& # 39;源# 39;,,,,,& # 39;目标# 39;,,,t, & # 39;价值# 39;,:,v});
,,,}
,,,var nodes =, [];
,,,. each美元(顶点,函数(k, v), {
,,,,,nodes.push({& # 39;名字# 39;,:,v, & # 39;价值# 39;,:,v});
,,,});
,,,图(& # 39;链接# 39;],=,链接;
,,,图(& # 39;数据# 39;],=,节点;
,,,return 图;
,,}
function 才能drawGraph(图),{
,,,var myChart =, echarts.init (. getelementbyid (“echarts-main"));
,,,var option =, {
,,,,,提示:,{},
,,,,,series :,
,,,,,,,{
,,,,,,,,,类型:,& # 39;图# 39;
,,,,,,,,,布局:,& # 39;力# 39;
,,,,,,,,,symbolSize:, 30日
,,,,,,,,,edgeSymbol:,(& # 39;没有# 39;,,& # 39;箭头# 39;],
,,,,,,,,,数据:,graph.data,
,,,,,,,,,链接:,graph.links,
,,,,,,,,,漫游:,真的,
,,,,,,,,,标签:,{
,,,,,,,,,,,正常:,{
,,,,,,,,,,,,,显示:,真的,
,,,,,,,,,,,,,格式化程序:,function (e), {
,,,,,,,,,,,,,,,return e[& # 39;数据# 39;][& # 39;价值# 39;];
,,,,,,,,,,,,,}
,,,,,,,,,,,}
,,,,,,,,,},
,,,,,,,,,edgeLabel:, {
,,,,,,,,,,,正常:,{
,,,,,,,,,,,,,显示:,真的,
,,,,,,,,,,,,,位置:,& # 39;中间# 39;
,,,,,,,,,,,}
,,,,,,,,,},
,,,,,,,,,的力量:,{
,,,,,,,,,,,排斥:,1000年,
,,,,,,,,,,,edgeLength: 200
,,,,,,,,,}
,,,,,,,}
,,,,,)
,,,};
,,,myChart.setOption(选项);
,,}
美元才能(文档)时函数(){
,,,画();
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
如何在jquery中使用echarts实现可视化?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。
