提交 098fe341 编写于 作者: L lin-xin

Update readme

上级 0a17d0f5
......@@ -37,7 +37,6 @@
| |-- BaseTable.vue // 基础表格
| |-- Login.vue // 登录
| |-- Markdown.vue // markdown组件
| |-- MixCharts.vue // 混合图表
| |-- Readme.vue // 自述组件
| |-- Upload.vue // 图片上传
| |-- VueEditor.vue // 富文本编辑器
......@@ -102,7 +101,7 @@
}
},
components: {
Datasource // 声明组件Datasource
Datasource
},
methods: {
changePage(values) {...},
......@@ -135,7 +134,7 @@
}
},
components: {
quillEditor // 声明组件quillEditor
quillEditor
}
}
</script>
......@@ -213,40 +212,44 @@ Vue.js的Markdown Editor组件。访问地址:[Vue-SimpleMDE](https://github.c
```
### vue-echarts-v3 ###
基于vue2和eCharts.js3的图表组件。访问地址:[vue-echarts-v3](https://github.com/xlsdg/vue-echarts-v3)
### vue-schart ###
vue.js封装sChart.js的图表组件。访问地址:[vue-schart](https://github.com/linxin/vue-schart)
```JavaScript
<template>
<div>
<IEcharts :option="bar"></IEcharts>
<schart :canvasId="canvasId"
:type="type"
:width="width"
:height="height"
:data="data"
:options="options"
></schart>
</div>
</template>
<script>
import IEcharts from 'vue-echarts-v3'; // 导入IEcharts组件
import Schart from 'vue-schart'; // 导入Schart组件
export default {
data: function(){
return {
bar: {
title: {
text: '柱状图' // 图标标题文本
},
tooltip: {},
xAxis: { // 横坐标
data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子']
},
yAxis: {}, // 纵坐标
series: [{
name: '销量',
type: 'bar', // 图标类型
data: [5, 20, 36, 10, 10, 20]
}]
canvasId: 'myCanvas', // canvas的id
type: 'bar', // 图表类型
width: 500,
height: 400,
data: [
{name: '2014', value: 1342},
{name: '2015', value: 2123},
{name: '2016', value: 1654},
{name: '2017', value: 1795},
],
options: { // 图表可选参数
title: 'Total sales of stores in recent years'
}
}
},
components: {
IEcharts // 声明组件VueCoreImageUpload
Schart
}
}
</script>
......
......@@ -68,10 +68,10 @@ The scheme as a set of multi-function background frame templates, suitable for m
## Component description and presentation ##
### element-ui ###
A desktop component library based on vue.js2.0 . live demo:[element](http://element.eleme.io/#/zh-CN/component/layout)
A desktop component library based on vue.js2.0 . Github : [element](http://element.eleme.io/#/zh-CN/component/layout)
### vue-datasource ###
A Vue.js server side component to create dynamic tables. live demo:[vue-datasource](https://github.com/coderdiaz/vue-datasource)
A Vue.js server side component to create dynamic tables. Github : [vue-datasource](https://github.com/coderdiaz/vue-datasource)
```JavaScript
<template>
......@@ -111,7 +111,7 @@ A Vue.js server side component to create dynamic tables. live demo:[vue-dataso
### Vue-Quill-Editor ###
Quill editor component for Vue2. live demo:[vue-quill-editor](https://github.com/surmon-china/vue-quill-editor)
Quill editor component for Vue2. Github : [vue-quill-editor](https://github.com/surmon-china/vue-quill-editor)
```JavaScript
<template>
......@@ -139,7 +139,7 @@ Quill editor component for Vue2. live demo:[vue-quill-editor](https://github.c
```
### Vue-SimpleMDE ###
Markdown Editor component for Vue.js. live demo:[Vue-SimpleMDE](https://github.com/F-loat/vue-simplemde)
Markdown Editor component for Vue.js. Github : [Vue-SimpleMDE](https://github.com/F-loat/vue-simplemde)
```JavaScript
<template>
......@@ -172,7 +172,7 @@ Markdown Editor component for Vue.js. live demo:[Vue-SimpleMDE](https://github
```
### Vue-Core-Image-Upload ###
a vue plugin for image upload and crop. live demo:[Vue-Core-Image-Upload](https://github.com/Vanthink-UED/vue-core-image-upload)
a vue plugin for image upload and crop. Github : [Vue-Core-Image-Upload](https://github.com/Vanthink-UED/vue-core-image-upload)
```JavaScript
......@@ -210,40 +210,44 @@ a vue plugin for image upload and crop. live demo:[Vue-Core-Image-Upload](http
```
### vue-echarts-v3 ###
Vue.js v2.x+ component wrap for ECharts.js v3.x+. live demo:[vue-echarts-v3](https://github.com/xlsdg/vue-echarts-v3)
### vue-schart ###
Vue.js wrapper for sChart.js. Github : [vue-schart](https://github.com/linxin/vue-schart)
```JavaScript
<template>
<div>
<IEcharts :option="bar"></IEcharts>
<schart :canvasId="canvasId"
:type="type"
:width="width"
:height="height"
:data="data"
:options="options"
></schart>
</div>
</template>
<script>
import IEcharts from 'vue-echarts-v3';
import Schart from 'vue-schart';
export default {
data: function(){
return {
bar: {
title: {
text: '柱状图'
},
tooltip: {},
xAxis: {
data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子']
},
yAxis: {},
series: [{
name: '销量',
canvasId: 'myCanvas',
type: 'bar',
data: [5, 20, 36, 10, 10, 20]
}]
width: 500,
height: 400,
data: [
{name: '2014', value: 1342},
{name: '2015', value: 2123},
{name: '2016', value: 1654},
{name: '2017', value: 1795},
],
options: {
title: 'Total sales of stores in recent years'
}
}
},
components: {
IEcharts
Schart
}
}
</script>
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册