Skip to content

Commit fe5e5a3

Browse files
Seungwoo321Seungwoo321
committed
docs: add guide about plotly-renderer
1 parent 1189c1e commit fe5e5a3

24 files changed

+122
-7
lines changed

‎.gitignore

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,4 +69,4 @@ typings/
6969

7070
#vuepress
7171
.temp
72-
docs/.vuepress/dist
72+
packages/docs/.vuepress/dist

‎docs/.vuepress/config.js renamed to ‎packages/docs/.vuepress/config.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,8 @@ function getGuideSidebar(groupA, groupB) {
8888
'locale',
8989
'slot',
9090
'scoped-slot',
91-
'utilities'
91+
'utilities',
92+
'renderer'
9293
]
9394
}
9495
]

‎docs/.vuepress/nav/en.js renamed to ‎packages/docs/.vuepress/nav/en.js

File renamed without changes.

‎docs/.vuepress/nav/ko.js renamed to ‎packages/docs/.vuepress/nav/ko.js

File renamed without changes.

‎docs/.vuepress/public/google603171b62dec4aac.html renamed to ‎packages/docs/.vuepress/public/google603171b62dec4aac.html

File renamed without changes.

‎docs/.vuepress/public/images/vue-pivottable-demo.gif renamed to ‎packages/docs/.vuepress/public/images/vue-pivottable-demo.gif

File renamed without changes.

‎docs/README.md renamed to ‎packages/docs/README.md

File renamed without changes.

‎deploy-docs.sh renamed to ‎packages/docs/deploy-docs.sh

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
#!/usr/bin/env sh
22
set -e
33

4-
rm -rf docs/.vuepress/dist/
4+
rm -rf packages/docs/.vuepress/dist/
55
npm run docs:build
6-
cd docs/.vuepress/dist/
6+
cd packages/docs/.vuepress/dist/
77

88
git init
99
git config --local user.name "Seungwoo Lee"

‎docs/guide/README.md renamed to ‎packages/docs/guide/README.md

File renamed without changes.

‎docs/guide/getting-started.md renamed to ‎packages/docs/guide/getting-started.md

File renamed without changes.

‎docs/guide/locale.md renamed to ‎packages/docs/guide/locale.md

File renamed without changes.

‎packages/docs/guide/renderer.md

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
# Renderer
2+
3+
## plotly renderer <sup style="color:#42b983">New in 0.4.6+</sup>
4+
5+
No longer include plotly-renderer in vue-pivottable, but you can use it like this:
6+
7+
### Install
8+
9+
```bash
10+
npm install @vue-pivottable/plotly-renderer
11+
```
12+
13+
### Usage
14+
15+
Just define a custom `renderer` function and pass it as props.
16+
17+
#### es6
18+
19+
```js
20+
import PlotlyRenderer from '@vue-pivottable/plotly-renderer'
21+
22+
const renderer = (() => ({
23+
'Grouped Column Chart': PlotlyRenderer['Grouped Column Chart'],
24+
'Stacked Column Chart': PlotlyRenderer['Stacked Column Chart'],
25+
'Grouped Bar Chart': PlotlyRenderer['Grouped Bar Chart'],
26+
'Stacked Bar Chart': PlotlyRenderer['Stacked Bar Chart'],
27+
'Line Chart': PlotlyRenderer['Line Chart'],
28+
'Dot Chart': PlotlyRenderer['Dot Chart'],
29+
'Area Chart': PlotlyRenderer['Area Chart'],
30+
'Scatter Chart': PlotlyRenderer['Scatter Chart'],
31+
'Multiple Pie Chart': PlotlyRenderer['Multiple Pie Chart']
32+
}))()
33+
```
34+
35+
#### browser
36+
37+
```html
38+
<!DOCTYPE html>
39+
<html lang="en">
40+
<head>
41+
<meta charset="UTF-8">
42+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
43+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
44+
<title>Plotly Renderer</title>
45+
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/vue-pivottable.css">
46+
<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
47+
<script src="https://unpkg.com/[email protected]/dist/vue-pivottable.umd.js"></script>
48+
<script src="dist/plotly-renderer.umd.js"></script>
49+
</head>
50+
<body>
51+
<div id="app">
52+
<vue-pivottable-ui
53+
:data="[{color: 'blue', shape: 'circle'},{color: 'red', shape: 'triangle'}]"
54+
renderer-name="Area Chart"
55+
:renderers="renderers"
56+
:rows="['color']"
57+
:cols="['shape']"
58+
>
59+
</vue-pivottable-ui>
60+
</div>
61+
<script type="text/javascript">
62+
Vue.use(VuePivottable.default)
63+
new Vue({
64+
el: '#app',
65+
computed: {
66+
renderers () {
67+
return (() => ({
68+
'Grouped Column Chart': PlotlyRenderer['Grouped Column Chart'],
69+
'Stacked Column Chart': PlotlyRenderer['Stacked Column Chart'],
70+
'Grouped Bar Chart': PlotlyRenderer['Grouped Bar Chart'],
71+
'Stacked Bar Chart': PlotlyRenderer['Stacked Bar Chart'],
72+
'Line Chart': PlotlyRenderer['Line Chart'],
73+
'Dot Chart': PlotlyRenderer['Dot Chart'],
74+
'Area Chart': PlotlyRenderer['Area Chart'],
75+
'Scatter Chart': PlotlyRenderer['Scatter Chart'],
76+
'Multiple Pie Chart': PlotlyRenderer['Multiple Pie Chart']
77+
}))()
78+
}
79+
}
80+
})
81+
</script>
82+
</body>
83+
</html>
84+
85+
```

‎docs/guide/scoped-slot.md renamed to ‎packages/docs/guide/scoped-slot.md

File renamed without changes.

‎docs/guide/slot.md renamed to ‎packages/docs/guide/slot.md

File renamed without changes.

‎docs/guide/utilities.md renamed to ‎packages/docs/guide/utilities.md

File renamed without changes.

‎docs/ko/README.md renamed to ‎packages/docs/ko/README.md

File renamed without changes.

‎docs/ko/guide/README.md renamed to ‎packages/docs/ko/guide/README.md

File renamed without changes.

‎docs/ko/guide/data.md renamed to ‎packages/docs/ko/guide/data.md

File renamed without changes.

‎docs/ko/guide/getting-started.md renamed to ‎packages/docs/ko/guide/getting-started.md

File renamed without changes.

‎docs/ko/guide/props.md renamed to ‎packages/docs/ko/guide/props.md

File renamed without changes.

‎docs/ko/guide/style.md renamed to ‎packages/docs/ko/guide/style.md

File renamed without changes.

‎packages/docs/package.json

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
{
2+
"name": "@vue-pivottable/docs",
3+
"version": "1.0.0",
4+
"description": "--- home: true title: Home actionText: Get Started actionLink: /guide/getting-started.html footer: MIT Licensed | Copyright © 2018-present Seungwoo Lee ---",
5+
"main": "index.js",
6+
"repository": {
7+
"type": "git",
8+
"url": "git://github.com/Seungwoo321/vue-pivottable.git"
9+
},
10+
"scripts": {
11+
"dev": "vuepress dev docs",
12+
"build": "vuepress build docs",
13+
"deploy": "sh deploy-docs.sh"
14+
},
15+
"keywords": [
16+
"vue",
17+
"pivot",
18+
"pivottable",
19+
"vue-pivottable"
20+
],
21+
"homepage": "https://seungwoo321.github.io/vue-pivottable/",
22+
"author": "Seungwoo, Lee <[email protected]> (https://github.com/seungwoo321)",
23+
"license": "MIT",
24+
"devDependencies": {
25+
"@vuepress/plugin-back-to-top": "^1.9.7",
26+
"@vuepress/plugin-google-analytics": "^1.9.7",
27+
"@vuepress/plugin-nprogress": "^1.9.7",
28+
"@vuepress/plugin-pwa": "^1.9.7",
29+
"vuepress": "^1.8.2"
30+
}
31+
}

‎docs/props/README.md renamed to ‎packages/docs/props/README.md

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -140,14 +140,12 @@ value of max-width in table style
140140

141141
generate custom color render for `Table Heatmap`
142142

143-
### locales
143+
### locales <sup style="color:#c92222;">deprecated</sup>
144144

145145
* Type: `Object`
146146
* Default: [see utilities](/guide/utilities.html#locales)
147147

148-
:::danger
149148
localeStrings is deprecated, replace in locales.
150-
:::
151149

152150
## Pivottable UI Props
153151

‎docs/styling/README.md renamed to ‎packages/docs/styling/README.md

File renamed without changes.

0 commit comments

Comments
 (0)