gui » context-menu » button
button
[ root » gui » context-menu » button ]
Use the button object to create a context menu button for your chart. You must add a visible attribute set to true for the button to appear. Refer to the Context Menu Tutorial for more information.
Note: If you are creating charts that will be primarily viewed on mobile devices, we recommend using the ZingChart mobile charts plugin. The plugin allows for the utilization of touch gestures and includes a mobile context menu.
| Attribute | Type | Info |
|---|---|---|
| alpha | Numeric | Sets the transparency of the object. Values must range between 0.0 and 1.0, with 0.0 being completely invisible and 1.0 being completely opaque. Please note that values also require the leading 0 before the decimal. 0.3 | 0.9 | ... |
| background-color backgroundColor | String | Sets the background color of the object. A single color will create a solid background, while two colors will create a gradient. "none" | "transparent" | "#f00" | "#f00 #00f" | "red yellow" | "rgb(100, 15, 15)" | ... |
| border-width borderWidth | Mixed | Sets the width of the object's border. 4 | "6px" | ... |
| font-color fontColor | String | Sets the object's font color. Similar to "none" | "transparent" | "#f00" | "#f00 #00f" | "red yellow" | "rgb(100, 15, 15)" | ... |
| font-family fontFamily | String | Sets the object's font family. "Arial" | "Tahoma,Verdana" | ... |
| font-size fontSize | Mixed | Sets the object's font size. 4 | "6px" | ... |
| font-style fontStyle | String | Sets the object's font style. Similar to "none" | "italic" | "oblique" |
| font-weight fontWeight | String | Sets the object's font weight. Similar to "normal" | "bold" |
| height | Mixed | Sets the object's height. 10 | "20px" | 0.3 | "30%" | ... |
| max-chars maxChars | Numeric | Sets the maximum numbers of characters displayed in the object. The value determines how many characters will be displayed before the text is cut and appended with "..." 5 | 10 | ... |
| max-width maxWidth | Mixed | Sets the maximum width of the text box. If text is longer than the max-width value, it will overlap the box or will wrap if wrap-text is set to true. 10 | "20px" | 0.3 | "30%" | ... |
| offset-x offsetX | Mixed | Sets an X offset to apply when positioning the object/shape. 4 | "6px" | ... |
| offset-y offsetY | Mixed | Sets a Y offset to apply when positioning the object/shape. 4 | "6px" | ... |
| padding | Mixed | Sets the padding around the object's text. Up to four values can be used to set the padding around the text, with the first value being the top padding, the second value being the right padding, the third value being the bottom padding, and the fourth value being the left padding. 10 | "5px" | "10 20" | "5px 10px 15px 20px" | ... |
| padding-bottom paddingBottom | Mixed | Sets the bottom padding for the object's text. 4 | "6px" | ... |
| padding-left paddingLeft | Mixed | Sets the left padding for the object's text. 4 | "6px" | ... |
| padding-right paddingRight | Mixed | Sets the right padding for the object's text. 4 | "6px" | ... |
| padding-top paddingTop | Mixed | Sets the top padding for the object's text. 4 | "6px" | ... |
| rtl (right-to-left) | Boolean | Renders text right-to-left. Default value is false. true | false | 1 | 0 |
| text | String | Sets the text content of the object. "Some Text" | ... |
| text-align textAlign | String | Sets the horizontal alignment for the object's text. Horizontal alignment can be left, center, or right. "left" | "center" | "right" |
| text-alpha textAlpha | Numeric | Sets the transparency of the object's text. Values must range between 0.0 and 1.0, with 0.0 being completely invisible and 1.0 being completely opaque. Please note that values also require the leading 0 before the decimal. 0.3 | 0.9 | ... |
| text-decoration textDecoration | String | Sets the text's decoration to use underlined characters. Similar to May not display properly in Mozilla Firefox when charts are rendered using SVG. "none" | "underline" |
| visible | Boolean | Sets whether the context-menu button is visible or not. true | false | 1 | 0 |
| width | Mixed | Sets the width of the object. 10 | "20px" | 0.3 | "30%" | ... |
| wrap-text wrapText | Boolean | Sets whether the text will wrap, depending on the width of the object. true | false | 1 | 0 |
| x | Mixed | Sets the X position of the object. The context-menu gear object must be positioned separately. 10 | "20px" | 0.3 | "30%" | ... |
| y | Mixed | Sets the Y position of the object. The context-menu gear object must be positioned separately. 10 | "20px" | 0.3 | "30%" | ... |