[]
• new ShapeStyle(style?
)
Represents a shape style.
Name | Type | Description |
---|---|---|
style? |
Object |
The style is an object that has same structure with a ShapeStyle instance, it is optional. |
• fill: IShapeFill
| IShapeGradientFill
| IShapePictureFill
| IShapeTextureFill
Indicates the fill options.
property
[type] - The fill type, it is ShapeFillType enum or formula(starts with =).
property
[color] - The background color, it is a color string or formula(starts with =).
property
{number | string} [transparency] - The background color transparency, it is a number that is between 0 and 1 or formula(starts with =).
example
//This sample sets background color and background color transparency for the shape.
var heart = sheet.shapes.add("Shape1", GC.Spread.Sheets.Shapes.AutoShapeType.heart, 100, 60, 200, 160);
var oldStyle = heart.style();
oldStyle.fill = {
type: GC.Spread.Sheets.Shapes.ShapeFillType.solid,
color: "red",
transparency: 0.5
};
heart.style(oldStyle);
//This sample sets gradient background for the shape.
var heart = sheet.shapes.add("Shape1", GC.Spread.Sheets.Shapes.AutoShapeType.heart, 100, 60, 200, 160);
var oldStyle = heart.style();
oldStyle.fill = {
type: GC.Spread.Sheets.Shapes.GradientFillType.linear,
angle: 45,
stops: [
{ color: 'blue', position: 0},
{ color: 'pink', position: 1}
]
};
heart.style(oldStyle);
//This sample sets picture background for the shape.
var heart = sheet.shapes.add("Shape1", GC.Spread.Sheets.Shapes.AutoShapeType.heart, 100, 60, 200, 160);
var oldStyle = heart.style();
oldStyle.fill = { src: "data:image/svg+xml;base64....." };
heart.style(oldStyle);
//This sample sets background color and background color transparency with formula for the shape.
var heart = sheet.shapes.add("Shape1", GC.Spread.Sheets.Shapes.AutoShapeType.heart, 100, 60, 200, 160);
sheet.setValue(0, 1, 1);
sheet.setValue(1, 1, "red");
sheet.setValue(2, 1, 0.5);
var oldStyle = heart.style();
oldStyle.fill = {
type: "=Sheet1!B1",
color: "=Sheet1!B2",
transparency: "=Sheet1!B3"
};
heart.style(oldStyle);
//This sample sets gradient background with formula for the shape.
var heart = sheet.shapes.add("Shape1", GC.Spread.Sheets.Shapes.AutoShapeType.heart, 100, 60, 200, 160);
var oldStyle = heart.style();
oldStyle.fill = {
type: "=Sheet1!A1",
angle: "=Sheet1!B1",
stops: [
{ color: "=Sheet1!A2", position: "=Sheet1!B2"},
{ color: "=Sheet1!A3", position: "=Sheet1!B3"}
]
};
heart.style(oldStyle);
• line: IShapeLine
Indicates the line options.
property
[color] - The line color, it is a color string or formula(starts with =).
property
{GC.Spread.Sheets.Shapes.PresetLineDashStyle | string} [lineStyle] - The line style, it is PresetLineDashStyle enum or formula(starts with =).
property
{number | string} [width] - The line width, it is a number or formula(starts with =).
property
{GC.Spread.Sheets.Shapes.LineCapStyle | string} [capType] - The line cap type, it is LineCapStyle enum or formula(starts with =).
property
{GC.Spread.Sheets.Shapes.LineJoinStyle | string} [joinType] - The line join type, it is LineJoinStyle enum or formula(starts with =).
property
{GC.Spread.Sheets.Shapes.CompoundType | string} [compoundType] - The line compound type, it is CompoundType enum or formula(starts with =).
property
{number | string} [transparency] - The line color transparency, it is a number that is between 0 and 1 or formula(starts with =).
property
[beginArrowheadStyle] - The begin arrowhead style, it is ArrowheadStyle enum.
property
[beginArrowheadWidth] - The begin arrowhead width, it is ArrowheadWidth enum.
property
[beginArrowheadLength] - The begin arrowhead length, it is ArrowheadLength enum.
property
[endArrowheadStyle] - The end arrowhead style, it is ArrowheadStyle enum.
property
[endArrowheadWidth] - The end arrowhead width, it is ArrowheadWidth enum.
property
[endArrowheadLength] - The end arrowhead length, it is ArrowheadLength enum.
example
//This sample sets line color, line style, line width, cap type, join type and line color transparency for the shape.
var shape = sheet.shapes.add("Shape1", GC.Spread.Sheets.Shapes.AutoShapeType.heart, 100, 60, 200, 160);
//var shape = sheet.shapes.addConnector("Shape1", GC.Spread.Sheets.Shapes.ConnectorType.straight, 100, 60, 200, 160);
var oldStyle = shape.style();
oldStyle.line.color = "red";
oldStyle.line.lineStyle = GC.Spread.Sheets.Shapes.PresetLineDashStyle.dashDot;
oldStyle.line.width = 5;
oldStyle.line.capType = GC.Spread.Sheets.Shapes.LineCapStyle.square;
oldStyle.line.joinType = GC.Spread.Sheets.Shapes.LineJoinStyle.miter;
oldStyle.line.compoundType = GC.Spread.Sheets.Shapes.CompoundType.double;
oldStyle.line.transparency = 0.5;
shape.style(oldStyle);
//This sample sets line color, line style, line width, cap type, join type and line color transparency with formula for the shape.
var shape = sheet.shapes.add("Shape1", GC.Spread.Sheets.Shapes.AutoShapeType.heart, 100, 60, 200, 160);
//var shape = sheet.shapes.addConnector("Shape1", GC.Spread.Sheets.Shapes.ConnectorType.straight, 100, 60, 200, 160);
sheet.setValue(0, 1, "red");
sheet.setValue(1, 1, 4);
sheet.setValue(2, 1, 5);
sheet.setValue(3, 1, 1);
sheet.setValue(4, 1, 1);
sheet.setValue(5, 1, 0.5);
var oldStyle = shape.style();
oldStyle.line.color = "=Sheet1!B1";
oldStyle.line.lineStyle = "=Sheet1!B2";
oldStyle.line.width = "=Sheet1!B3";
oldStyle.line.capType = "=Sheet1!B4";
oldStyle.line.joinType = "=Sheet1!B5";
oldStyle.line.transparency = "=Sheet1!B6";
oldStyle.line.compoundType = "=Sheet1!B7";
shape.style(oldStyle);
//This sample sets line's begin arrowhead style, width, length and end arrowhead style, width, height for the shape.
var shape = sheet.shapes.addConnector("Shape1", GC.Spread.Sheets.Shapes.ConnectorType.straight, 100, 60, 200, 160);
var oldStyle = shape.style();
oldStyle.line.beginArrowheadStyle = GC.Spread.Sheets.Shapes.ArrowheadStyle.triangle;
oldStyle.line.beginArrowheadWidth = GC.Spread.Sheets.Shapes.ArrowheadWidth.narrow;
oldStyle.line.beginArrowheadLength = GC.Spread.Sheets.Shapes.ArrowheadLength.short;
oldStyle.line.endArrowheadStyle = GC.Spread.Sheets.Shapes.ArrowheadStyle.diamond;
oldStyle.line.endArrowheadWidth = GC.Spread.Sheets.Shapes.ArrowheadWidth.wide;
oldStyle.line.endArrowheadLength = GC.Spread.Sheets.Shapes.ArrowheadLength.long;
shape.style(oldStyle);
• textEffect: IShapeTextEffect
Indicates the text effect options.
property
[color] - The font color, it is a color string or formula(starts with =).
property
{number | string} [transparency] - The font color transparency, it is a number that is between 0 and 1 or formula(starts with =).
property
[font] - The font, it is a font string or formula(starts with =).
example
//This sample sets the font color, font color transparency and font for the shape.
var heart = sheet.shapes.add("Shape1", GC.Spread.Sheets.Shapes.AutoShapeType.heart, 100, 60, 200, 160);
var oldStyle = heart.style();
oldStyle.textEffect.color = "red";
oldStyle.textEffect.transparency = 0.5;
oldStyle.textEffect.font = "20px Arial";
heart.style(oldStyle);
heart.text("Heart");
//This sample sets the font color, font color transparency and font with formula for the shape.
var heart = sheet.shapes.add("Shape1", GC.Spread.Sheets.Shapes.AutoShapeType.heart, 100, 60, 200, 160);
sheet.setValue(0, 1, "red");
sheet.setValue(1, 1, 0.5);
sheet.setValue(2, 1, "20px Arial");
var oldStyle = heart.style();
oldStyle.textEffect.color = "=Sheet1!B1";
oldStyle.textEffect.transparency = "=Sheet1!B2";
oldStyle.textEffect.font = "=Sheet1!B3";
heart.style(oldStyle);
heart.text("Heart");
• textFrame: IShapeTextFrame
Indicates the text frame options.
property
{GC.Spread.Sheets.VerticalAlign | string} [vAlign] - The text vertical alignment, it is VerticalAlign enum or formula(starts with =).
property
{GC.Spread.Sheets.HorizontalAlign | string} [hAlign] - The text horizontal alignment, it is HorizontalAlign enum or formula(starts with =).
example
//This sample sets the text horizontal alignment and vertical alignment for the shape.
var heart = sheet.shapes.add("Shape1", GC.Spread.Sheets.Shapes.AutoShapeType.heart, 100, 60, 200, 160);
var oldStyle = heart.style();
oldStyle.textFrame.vAlign = GC.Spread.Sheets.VerticalAlign.center;
oldStyle.textFrame.hAlign = GC.Spread.Sheets.HorizontalAlign.center;
heart.style(oldStyle);
heart.text("Heart");
//This sample sets the text horizontal alignment and vertical alignment with formula for the shape.
var heart = sheet.shapes.add("Shape1", GC.Spread.Sheets.Shapes.AutoShapeType.heart, 100, 60, 200, 160);
sheet.setValue(0, 1, 1);
sheet.setValue(1, 1, 1);
var oldStyle = heart.style();
oldStyle.textFrame.vAlign = "=Sheet1!B1";
oldStyle.textFrame.hAlign = "=Sheet1!B2";
heart.style(oldStyle);
heart.text("Heart");