AnyGraph示例:加载电网数据
本示例演示:加载电网数据
xxxxxxxxxx
<div id="graphWrapper" data-type="graph" style="width:100%; height:600px; border:solid 1px #CCC;"></div>
xxxxxxxxxx
import { Graph, View, Layer, VectorSource, Geometry, BgUtil, AxfgFormat, AxfgLoader } from "../../src/index.js";
let fileUrl = "../../demo-data/devp/bd/station.json";
let symbolFileUrl = "../../demo-data/meta/meta_symbol.xml";
let nodeTypeFileUrl = "../../demo-data/meta/meta_nodetype.awg";
let layerStyleUrl = "../../demo-data/meta/meta_layer_style.awg";
let adamGraph;
$(document).ready(function () {
// graph对象
adamGraph = new Graph({
"target": "graphWrapper",
"fullView": true,
"originAtLeftTop": false
});
// 显示辅助网格
BgUtil.generateGrid(Object.assign({ "interval": 10, "graph": adamGraph }, adamGraph.getSize()));
// 使用loader加载元数据,使用dataSource加载单个adam文件
let loader = new AxfgLoader(adamGraph, { symbolFileUrl, nodeTypeFileUrl, layerStyleUrl });
loader.loadMetaData(function () {
let dataLayer = new Layer({
source: new VectorSource({
"fileUrl": fileUrl,
"format": new AxfgFormat({
"symbol": loader.getSymbolManager(),
"style": loader.getStyleManager()
})
}),
name: "GROW Data"
})
adamGraph.addLayer(dataLayer);
});
});