<template>
    <div id="app">
        <DoLine width="500px" :color="['pink']"/>
        <DoPie 
            insertText="hah" 
            insertColor="pink" 
            insertTextColor="#000" 
            :changeOpt="{legend:{icon:'rect'}}" 
            :pieOpt="{radius: ['40%', '70%']}"/>
        <DoLineAndBar/>
        <DoLine :charsData="line.charsData"/>
        <DoBar />
        <DoBar />
        <DoMap />
        <DoMap type="wuhan"/>
        <DoMap type="hp" :mapData="[{ name: '黄陂', value: [114.37,30.881] }]" :labelText="true"/>
    </div>
</template>
<script>
import DoPie from '../packages/DoPie/DoPie'
import DoBar from '../packages/DoBar/DoBar'
import DoLine from '../packages/DoLine/DoLine'
import DoLineAndBar from '../packages/DoLineAndBar/DoLineAndBar'
import DoMap from '../packages/DoMap/DoMap'
export default {
    name: "app",
    components:{
        DoPie,
        DoLineAndBar,
        DoLine,
        DoBar,
        DoMap
    },
    data() {
        return {
            line: {
                charsData: [
                    {
                        name: "人均年收入",
                        data: [11, 11, 15, 13, 12],
                        xAxisData: [
                            "2014年",
                            "2015年",
                            "2016年",
                            "2017年",
                            "2018年"
                        ]
                    },
                    {
                        name: "人均年收入2",
                        data: [12, 13, 14, 15, 13],
                    }
                ]
            }
        };
    }
};
</script>