https://blog.csdn.net/qq_38737992/article/details/89042164
用的是这个csdn里面，Echarts 绘制关系图(知识图谱可视化)，数据在echart写的死的，我想用ajax取数据库数据显示在这个例子里面的引力图里面，但是数据可以取出来不知道怎么放进去，求解
我套用后的代码。
@ViewBag.Title
@* 引用 *@
查询
var myChart = echarts.init(document.getElementById(‘main’));
var categories = [];
for (var i = 0; i < 2; i++) {
categories[i] = {
name: ‘类目’ + i
};
}
options = {
// 图的标题
title: {
text: ‘ECharts 关系图’
},
// 提示框的配置
tooltip: {
formatter: function (x) {
return x.data.des;
}
},
// 工具箱
toolbox: {
// 显示工具箱
show: true,
feature: {
mark: {
show: true
},
// 还原
restore: {
show: true
},
// 保存为图片
saveAsImage: {
show: true
}
}
},
legend: [{
// selectedMode: ‘single’,
data: categories.map(function (a) {
return a.name;
})
}],
series: [{
type: ‘graph’, // 类型:关系图
layout: ‘force’, //图的布局，类型为力导图
symbolSize: 40, // 调整节点的大小
roam: true, // 是否开启鼠标缩放和平移漫游。默认不开启。如果只想要开启缩放或者平移,可以设置成 ‘scale’ 或者 ‘move’。设置成 true 为都开启
edgeSymbol: [‘circle’, ‘arrow’],
edgeSymbolSize: [2, 10],
edgeLabel: {
normal: {
textStyle: {
fontSize: 20
}
}
},
force: {
repulsion: 2500,
edgeLength: [10, 50]
},
draggable: true,
lineStyle: {
normal: {
width: 2,
color: ‘#4b565b’,
}
},
edgeLabel: {
normal: {
show: true,
formatter: function (x) {
return x.data.name;
}
}
},
label: {
normal: {
show: true,
textStyle: {}
}
},
// 数据
//data: [{
// name: ‘node01’,
// des: ‘node1’,
// symbolSize: 70,
// category: 0,
//}, {
// name: ‘node02’,
// des: ‘nodedes02’,
// symbolSize: 50,
// category: 1,
//}, {
// name: ‘node03’,
// des: ‘nodedes3’,
// symbolSize: 50,
// category: 1,
//}, {
// name: ‘node04’,
// des: ‘nodedes04’,
// symbolSize: 50,
// category: 1,
//}, {
// name: ‘node05’,
// des: ‘nodedes05’,
// symbolSize: 50,
// category: 1,
//}],
//links: [{
// source: ‘node01’,
// target: ‘node02’,
// name: ‘link01’,
// des: ‘link01des’
//}, {
// source: ‘node01’,
// target: ‘node03’,
// name: ‘link02’,
// des: ‘link02des’
//}, {
// source: ‘node01’,
// target: ‘node04’,
// name: ‘link03’,
// des: ‘link03des’
//}, {
// source: ‘node01’,
// target: ‘node05’,
// name: ‘link04’,
// des: ‘link05des’
//}],
data: [],
categories: categories,
}]
};
myChart.setOption(options); @* ajax 取数据*@
function getData() {
$.ajax({
type: “POST”,
async: false,
contentType: ‘application/json; charset=utf-8’, //如果不指定该参数，总是返回跳到error部分，而无法执行success部分
url: “/Home/GetPeople”, //调用后台Webservice
dataType: “json”, //返回数据形式为json
success: function (result) {
alert(“qwwq”+result)
var obj = JSON.parse(result); //一定要注意大小写，让它跟后台返回的JSON语句中一致。result.d.Data是字串数据，需要重新转换成JSON
if (result) {
//将返回的category和series对象赋值给options对象内的category和series
//因为xAxis是一个数组 这里需要是xAxis[i]的形式
//options.yAxis[0].data = obj.value;
//options.xAxis[0].data = obj.category;
//options.series = obj.series;
//options.legend.data = obj.legend;
for (var i = 0; i < result.length; i++) {
var str = new Object();
str.value = result[i];
}
//options.series[0].data = str;
//options.title = result[10];
//myChart.hideLoading();
//myChart.setOption({ //加载数据图表
// title: {
// text: ‘关系图’
// },
// series: [{
// // 根据名字对应到相应的系列
// name: ‘销量’,
// data: str.value
// }]
//});
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.responseText);
}
});
}
这个是后台的去数据库的数据，简单的取people类名字
public ActionResult GetPeople(String name)
{
ViewBag.Message = “Your contact page.”;
Class1 n = new Class1(“bolt://localhost:7687”, “neo4j”, “0906”);
List people = n.GetPeople();
//ViewBag.People = people;
//return people;
JavaScriptSerializer jss = new JavaScriptSerializer();
string stringList = jss.Serialize(people);//将当前的List对象集合转换成字符串(JSON格式)
//【3】返回JSON格式数据 来自Http的所有Get方式都能响应
return Json(stringList, JsonRequestBehavior.AllowGet);
}
可以alert(“qwwq”+result) 显示数据库里面people类名字，但是无法填充到echart样例里面的引力图理 求解