本文整理匯總了TypeScript中@hpcc-js/common.Palette類的典型用法代碼示例。如果您正苦於以下問題:TypeScript Palette類的具體用法?TypeScript Palette怎麽用?TypeScript Palette使用的例子?那麽, 這裏精選的類代碼示例或許可以為您提供幫助。
在下文中一共展示了Palette類的6個代碼示例,這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚,您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: describe
describe(`${item.prototype.constructor.name}`, () => {
if (item.prototype instanceof Class) {
classDef("graph", item);
}
if (item.prototype instanceof HTMLWidget || item.prototype instanceof SVGWidget) {
switch (item.prototype.constructor) {
case Edge:
const graph = new Graph();
const vertices: any[] = [];
const edges: any[] = [];
const palette = Palette.ordinal("dark2");
const rawData = data.simple;
rawData.nodes.forEach(function (node) {
vertices.push(
new Vertex()
.text(node.name)
.textbox_shape_colorStroke(palette(node.icon))
.textbox_shape_colorFill("whitesmoke")
.icon_diameter(60)
.icon_shape_colorStroke("transparent")
.icon_shape_colorFill("transparent")
.icon_image_colorFill("#333333")
.textbox_shape_colorStroke("transparent")
.textbox_shape_colorFill("transparent")
.textbox_text_colorFill("#333333")
.iconAnchor("middle")
.faChar(node.icon)
)
;
}, graph);
rawData.links.forEach(function (link, idx) {
edges.push(
new Edge()
.sourceVertex(vertices[link.source])
.targetVertex(vertices[link.target])
.sourceMarker("circle")
.targetMarker("arrow")
.text("Hello!")
.strokeDasharray(idx === 0 ? "15, 10, 5, 10, 15" : "")
.strokeColor(idx === 0 ? "cyan" : "")
.weight(50)
)
;
}, graph);
graph.data({ vertices, edges });
render(graph);
break;
case AdjacencyGraph:
render(new AdjacencyGraph()
.columns(["uid", "label", "links"])
.data([
[1, "AdjacencyGraph 1", [[2], [3], [4]]],
[2, "AdjacencyGraph 2", []],
[3, "AdjacencyGraph 3", []],
[4, "AdjacencyGraph 4", []]
] as any)
);
break;
case Graph:
const graph2 = new Graph();
const vertices2: any[] = [];
const edges2: any[] = [];
const palette2 = Palette.ordinal("dark2");
const rawData2 = data.simple;
rawData2.nodes.forEach(function (node) {
vertices2.push(
new Vertex()
.text(node.name)
.textbox_shape_colorStroke(palette2(node.icon))
.textbox_shape_colorFill("whitesmoke")
.icon_diameter(30)
.icon_shape_colorStroke(palette2(node.icon))
.icon_shape_colorFill(palette2(node.icon))
.faChar(node.icon)
);
}, graph2);
rawData2.links.forEach(function (link, idx) {
edges2.push(
new Edge()
.sourceVertex(vertices2[link.source])
.targetVertex(vertices2[link.target])
.sourceMarker("circle")
.targetMarker("arrow")
.text("")
.weight(50)
);
}, graph2);
graph2.data({ vertices: vertices2, edges: edges2 });
render(graph2);
break;
case Sankey:
render(new Sankey()
.columns(dataBreach.columns)
.data(dataBreach.data)
//.........這裏部分代碼省略.........
示例2: function
INDChart.prototype.textColor = function (row: any[], column: string, value: number): string {
return Palette.textColor(this.fillColor(row, column, value));
};
示例3: INDChart
import { Palette } from "@hpcc-js/common";
import { hsl as d3Hsl } from "d3-color";
export function INDChart() {
}
INDChart.prototype._dataFamily = "ND";
INDChart.prototype._palette = Palette.ordinal("default");
INDChart.prototype.fillColor = function (row: any[], column: string, value: number): string {
return this._palette(column);
};
INDChart.prototype.strokeColor = function (row: any[], column: string, value: number): string {
return d3Hsl(this.fillColor(row, column, value)).darker().toString();
};
INDChart.prototype.textColor = function (row: any[], column: string, value: number): string {
return Palette.textColor(this.fillColor(row, column, value));
};
// Events ---
INDChart.prototype.click = function (row, column, selected) {
console.log("Click: " + JSON.stringify(row) + ", " + column + ", " + selected);
};
INDChart.prototype.dblclick = function (row, column, selected) {
console.log("Double click: " + JSON.stringify(row) + ", " + column + ", " + selected);
};
示例4: IChoropleth
import { Palette } from "@hpcc-js/common";
export function IChoropleth() {
}
IChoropleth.prototype._palette = Palette.rainbow("default");
// Events ---
IChoropleth.prototype.click = function (row, column, selected) {
console.log("Click: " + JSON.stringify(row) + ", " + column + ", " + selected);
};
示例5: function
I2DAggrChart.prototype.textColor = function (row: any[][], column, value): string {
return Palette.textColor(this.fillColor(row, column, value));
};
示例6: I2DAggrChart
import { Palette } from "@hpcc-js/common";
import { hsl as d3Hsl } from "d3-color";
export function I2DAggrChart() {
}
I2DAggrChart.prototype._palette = Palette.rainbow("default");
I2DAggrChart.prototype.fillColor = function (row: any[][], column, value): string {
return this._palette(row.length);
};
I2DAggrChart.prototype.strokeColor = function (row: any[][], column, value): string {
return d3Hsl(this.fillColor(row, column, value)).darker().toString();
};
I2DAggrChart.prototype.textColor = function (row: any[][], column, value): string {
return Palette.textColor(this.fillColor(row, column, value));
};
// Events ---
I2DAggrChart.prototype.click = function (row: object[], column, selected) {
console.log("Click: " + JSON.stringify(row) + ", " + column + ", " + selected);
};
I2DAggrChart.prototype.dblclick = function (row: object[], column, selected) {
console.log("Double click: " + JSON.stringify(row) + ", " + column + ", " + selected);
};