@jiaminghi/c-render
Advanced tools
Comparing version 0.2.2 to 0.2.3
@@ -0,1 +1,8 @@ | ||
# 0.2.3-alpha (2019-04-29) | ||
### Perfect | ||
- **graph:** Improve graph basic properties. | ||
- **Documentation:** Perfect documentation. | ||
# 0.2.2-alpha (2019-04-25) | ||
@@ -2,0 +9,0 @@ |
@@ -81,3 +81,21 @@ import Style from './style.class' | ||
*/ | ||
hoverRect: null | ||
hoverRect: null, | ||
/** | ||
* @description Mouse enter event handler | ||
* @type {Function|Null} | ||
* @default mouseEnter = null | ||
*/ | ||
mouseEnter: null, | ||
/** | ||
* @description Mouse outer event handler | ||
* @type {Function|Null} | ||
* @default mouseOuter = null | ||
*/ | ||
mouseOuter: null, | ||
/** | ||
* @description Mouse click event handler | ||
* @type {Function|Null} | ||
* @default click = null | ||
*/ | ||
click: null | ||
} | ||
@@ -84,0 +102,0 @@ |
{ | ||
"name": "@jiaminghi/c-render", | ||
"version": "0.2.2", | ||
"version": "0.2.3", | ||
"author": "JiaMing <743192023@qq.com>", | ||
@@ -5,0 +5,0 @@ "description": "Canvas-based vector graphics rendering plugin", |
149
README.md
@@ -232,2 +232,4 @@ <h1 align="center">CRender</h1> | ||
**When adding a graph, you can configure them.** | ||
- [visible](#visible) | ||
@@ -244,2 +246,5 @@ - [shape](#shape) | ||
- [hoverRect](#hoverRect) | ||
- [mouseEnter](#mouseEnter) | ||
- [mouseOuter](#mouseOuter) | ||
- [click](#click) | ||
@@ -361,2 +366,36 @@ #### visible | ||
#### mouseEnter | ||
```javascript | ||
/** | ||
* @description Mouse enter event handler | ||
* @type {Function|Null} | ||
* @default mouseEnter = null | ||
*/ | ||
``` | ||
#### mouseOuter | ||
```javascript | ||
/** | ||
* @description Mouse outer event handler | ||
* @type {Function|Null} | ||
* @default mouseOuter = null | ||
*/ | ||
``` | ||
#### click | ||
```javascript | ||
/** | ||
* @description Mouse click event handler | ||
* @type {Function|Null} | ||
* @default click = null | ||
*/ | ||
``` | ||
#### Tip | ||
Enable **mouseEnter**, **mouseOuter**, **click** event support requires configuring the `hover` property of the graph to `true`. Extended new graph require the **hoverCheck** method to be configured to provide event support. | ||
### prototype | ||
@@ -782,2 +821,10 @@ | ||
##### shape attribute | ||
| Attribute name | Type | Default | Annotation | | ||
| :------------: | :------: | :-----: | :-----------------------: | | ||
| rx | `Number` | `0` | Center x-axis coordinate. | | ||
| ry | `Number` | `0` | Center r-axis coordinate. | | ||
| r | `Number` | `0` | Circle radius. | | ||
```javascript | ||
@@ -817,2 +864,11 @@ const { area: [w, h] } = render | ||
##### shape attribute | ||
| Attribute name | Type | Default | Annotation | | ||
| :------------: | :------: | :-----: | :-----------------------: | | ||
| rx | `Number` | `0` | Center x-axis coordinate. | | ||
| ry | `Number` | `0` | Center y-axis coordinate. | | ||
| hr | `Number` | `0` | Horizontal axis radius. | | ||
| vr | `Number` | `0` | Vertical axis radius. | | ||
```javascript | ||
@@ -852,2 +908,11 @@ const { area: [w, h] } = render | ||
##### shape attribute | ||
| Attribute name | Type | Default | Annotation | | ||
| :------------: | :------: | :-----: | :-------------------------------------------------------: | | ||
| x | `Number` | `0` | The x coordinate of the top left corner of the rectangle. | | ||
| y | `Number` | `0` | The y coordinate of the top left corner of the rectangle. | | ||
| w | `Number` | `0` | Rectangle width. | | ||
| h | `Number` | `0` | Rectangle height. | | ||
```javascript | ||
@@ -889,2 +954,10 @@ const { area: [w, h] } = render | ||
##### shape attribute | ||
| Attribute name | Type | Default | Annotation | | ||
| :------------: | :------: | :-----: | :-----------------------: | | ||
| rx | `Number` | `0` | Center x-axis coordinate. | | ||
| ry | `Number` | `0` | Center y-axis coordinate. | | ||
| r | `Number` | `0` | Ring radius. | | ||
```javascript | ||
@@ -923,2 +996,13 @@ const { area: [w, h] } = render | ||
##### shape attribute | ||
| Attribute name | Type | Default | Annotation | | ||
| :------------: | :-------: | :-----: | :-----------------------: | | ||
| rx | `Number` | `0` | Center x-axis coordinate. | | ||
| ry | `Number` | `0` | Center y-axis coordinate. | | ||
| r | `Number` | `0` | Arc radius. | | ||
| startAngle | `Number` | `0` | Arc start angle. | | ||
| endAngle | `Number` | `0` | Arc end angle. | | ||
| clockWise | `Boolean` | `true` | Clockwise | | ||
```javascript | ||
@@ -962,2 +1046,13 @@ const { area: [w, h] } = render | ||
##### shape attribute | ||
| Attribute name | Type | Default | Annotation | | ||
| :------------: | :-------: | :-----: | :-----------------------: | | ||
| rx | `Number` | `0` | Center x-axis coordinate. | | ||
| ry | `Number` | `0` | Center y-axis coordinate. | | ||
| r | `Number` | `0` | Sector radius. | | ||
| startAngle | `Number` | `0` | Sector start angle. | | ||
| endAngle | `Number` | `0` | Sector end angle. | | ||
| clockWise | `Boolean` | `true` | Clockwise | | ||
```javascript | ||
@@ -1000,2 +1095,11 @@ const { area: [w, h] } = render | ||
##### shape attribute | ||
| Attribute name | Type | Default | Annotation | | ||
| :------------: | :------: | :-----: | :-----------------------: | | ||
| rx | `Number` | `0` | Center x-axis coordinate. | | ||
| ry | `Number` | `0` | Center y-axis coordinate. | | ||
| r | `Number` | `0` | Circumradius. | | ||
| side | `Number` | `0` | Edge number. | | ||
```javascript | ||
@@ -1037,2 +1141,9 @@ const { area: [w, h] } = render | ||
##### shape attribute | ||
| Attribute name | Type | Default | Annotation | | ||
| :------------: | :-------: | :-----: | :------------------------------------: | | ||
| points | `Array` | `[]` | The points that makes up the polyline. | | ||
| close | `Boolean` | `false` | Whether to close the polyline. | | ||
```javascript | ||
@@ -1127,2 +1238,9 @@ const { area: [w, h] } = render | ||
##### shape attribute | ||
| Attribute name | Type | Default | Annotation | | ||
| :------------: | :-------: | :-----: | :--------------------------------------: | | ||
| points | `Array` | `[]` | The points that makes up the smoothline. | | ||
| close | `Boolean` | `false` | Whether to close the smoothline. | | ||
```javascript | ||
@@ -1226,2 +1344,9 @@ const { area: [w, h] } = render | ||
##### shape attribute | ||
| Attribute name | Type | Default | Annotation | | ||
| :------------: | :-------: | :-----: | :---------------------------------------: | | ||
| points | `Array` | `[]` | The points that makes up the bezierCurve. | | ||
| close | `Boolean` | `false` | Whether to close the smoothline. | | ||
```javascript | ||
@@ -1234,8 +1359,12 @@ const { area: [w, h] } = render | ||
const points = [ | ||
// Start point | ||
[-100 + offsetX, -50 + offsetY], | ||
// Multiple sets of bezier curve | ||
[ | ||
// controlPoint1,controlPoint2,endPoint | ||
[0 + offsetX, -50 + offsetY], | ||
[0 + offsetX, 50 + offsetY], | ||
[100 + offsetX, 50 + offsetY] | ||
] | ||
], | ||
// [...],[...] | ||
] | ||
@@ -1340,2 +1469,10 @@ | ||
##### shape attribute | ||
| Attribute name | Type | Default | Annotation | | ||
| :------------: | :------: | :---------: | :------------------------: | | ||
| content | `String` | `''` | Text content. | | ||
| position | `Array` | `[0, 0]` | Text start position. | | ||
| maxWidth | `Number` | `Undefined` | Maximum width of the text. | | ||
```javascript | ||
@@ -1386,2 +1523,6 @@ const { area: [w, h] } = render | ||
##### Tip | ||
Graph of **text** should be configured with `hoverRect` to support mouse events. | ||
<h3 align="center">Extend New Graph</h3> | ||
@@ -1564,3 +1705,3 @@ | ||
- [Transition](#https://github.com/jiaming743/transition) | ||
- [Transition](https://github.com/jiaming743/transition) | ||
@@ -1577,8 +1718,8 @@ Provide animation transition data(animationCurve). | ||
- [BezierCurve](#https://github.com/jiaming743/bezierCurve) | ||
- [BezierCurve](https://github.com/jiaming743/bezierCurve) | ||
Provides support for bezierCurve, such as curve length calculation, conversion between curve and polyline. | ||
- [Color](#https://github.com/jiaming743/Color) | ||
- [Color](https://github.com/jiaming743/Color) | ||
Provides calculation of color values. |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
132308
1668
1707