Here are the definitions for D3.Layout.GraphNode
and D3.Layout.GraphLink
as defined in borisyankov/DefinitelyTyped .
export interface GraphNode {
id: number;
index: number;
name: string;
px: number;
py: number;
size: number;
weight: number;
x: number;
y: number;
subindex: number;
startAngle: number;
endAngle: number;
value: number;
fixed: bool;
children: GraphNode[];
_children: GraphNode[];
parent: GraphNode;
depth: number;
}
export interface GraphLink {
source: GraphNode;
target: GraphNode;
}
However, a GraphNode
does not necessary always have ALL of these properties. For example, here is a GraphLink
with a source:GraphNode
and a target:GraphNode
, both of which do not have all of the properties.
Furthermore, I can't have a class such as:
class GraphData {
nodes: D3.Layout.GraphNode[];
links: D3.Layout.GraphLink[];
}
Because then doing this does not work:
var data:GraphData = {
"nodes": [{
"group": 0,
"id": 0
}, {
"group": 0,
"id": 1
}, {
"group": 0,
"id": 2
}],
"links": [{
"source": 0,
"target": 2,
"value": 1
}, {
"source": 0,
"target": 0,
"value": 1
}, {
"source": 2,
"target": 1,
"value": 1
}, {
"source": 2,
"target": 1,
"value": 1
}]
}
The typescript compiler gives me this error:
Compile Error.
See error list for details
C:/Projects/MyGraph/app.ts(111,23): error TS2082: Supplied parameters do not match any signature of call target:
Types of property 'nodes' of types '{ "nodes": { "group": number; "id": number; }[]; "links": { "source": number; "target": number; "value": number; }[]; }' and 'GraphData' are incompatible:
Type '{ "group": number; "id": number; }' is missing property 'index' from type 'D3.Layout.GraphNode'.
A way to fix this is to make all of the fields in the interface GraphNode
optional. But then the interface is useless. How do I take advantage of TypeScripts static typing in this case?
All of them are not required but perhaps some are and the interface definition does not reflect that as of yet. Perhaps you can mark which ones are optional for community support.
In any case. When you want to enforce strict behavior on others but want the flexibility to break out your self you can use any. eg :
var data:GraphData = <any>{
"nodes": [{
"group": 0,
"id": 0
}, {
"group": 0,
"id": 1
}, {
"group": 0,
"id": 2
}],
"links": [{
"source": 0,
"target": 2,
"value": 1
}, {
"source": 0,
"target": 0,
"value": 1
}, {
"source": 2,
"target": 1,
"value": 1
}, {
"source": 2,
"target": 1,
"value": 1
}]
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.