Skip to content

N
national-dashboard
Commit c97e23b3 authored by 郭铭瑶's avatar 郭铭瑶 🤘
Browse files
Options

添加数据

parent ae467204
Hide whitespace changes
Inline Side-by-side
Showing with 4137 additions and 309 deletions
src/App.vue
View file @ c97e23b3
<template> <template>
<div id="app"> <div id="app">
<!-- <transition name="custom-classes-transition" enter-active-class="animated fadeIn" leave-active-class="animated fadeOut"> --> <transition name="custom-classes-transition" enter-active-class="animated fadeIn" leave-active-class="animated fadeOut">
<router-view :key="$route.fullPath"/> <router-view :key="$route.fullPath"/>
<!-- </transition> --> </transition>
</div> </div>
</template> </template>
...@@ -11,42 +11,42 @@ export default { ...@@ -11,42 +11,42 @@ export default {
name: 'App', name: 'App',
data() { data() {
return { return {
routes: ['home', 'industry', 'special', 'production', 'trade', 'fish', 'disease', 'enterprise', 'flow'], routes: ['farming', 'fishing'],
cur: 0, cur: 0,
timer: null, timer: null,
timeOuter: null, timeOuter: null,
seconds: 1000 * 10 seconds: 1000 * 10
} }
}, },
// mounted() { mounted() {
// // this.$router.push({ this.$router.push({
// // name: this.routes[this.cur] name: this.routes[this.cur]
// // }) })
// // this.setTimer() this.setTimer()
// // document.body.addEventListener('mousemove', this.removeTimer) document.body.addEventListener('mousemove', this.removeTimer)
// }, },
// beforeDestroy() { beforeDestroy() {
// clearInterval(this.timer) clearInterval(this.timer)
// }, },
// methods: { methods: {
// setTimer() { setTimer() {
// this.timer = setInterval(() => { this.timer = setInterval(() => {
// this.cur += 1 this.cur += 1
// if (this.cur >= this.routes.length) { if (this.cur >= this.routes.length) {
// this.cur = 0 this.cur = 0
// } }
// this.$router.push({ this.$router.push({
// name: this.routes[this.cur] name: this.routes[this.cur]
// }) })
// }, this.seconds) }, this.seconds)
// }, },
// removeTimer() { removeTimer() {
// clearTimeout(this.timeOuter) clearTimeout(this.timeOuter)
// clearInterval(this.timer) clearInterval(this.timer)
// this.timer = null this.timer = null
// this.timeOuter = setTimeout(this.setTimer, this.seconds / 10) this.timeOuter = setTimeout(this.setTimer, this.seconds / 10)
// }, },
// }, },
// watch: { // watch: {
// $route(to, from) { // $route(to, from) {
// if (to.name && this.cur != this.routes.indexOf(to.name)) { // if (to.name && this.cur != this.routes.indexOf(to.name)) {
......
src/assets/css/reset.styl
View file @ c97e23b3
...@@ -4,10 +4,11 @@ $color-main = #5BD5FF ...@@ -4,10 +4,11 @@ $color-main = #5BD5FF
.ivu-select-selection .ivu-select-selection
.ivu-select-dropdown .ivu-select-dropdown
font-size 0.8rem font-size 0.8rem
background-color rgba(0,0,0,0.2) background-color $color-map(0.8)
border-radius 0 border-radius 0
border 0.1rem solid $color-main border 0.1rem solid $color-main
color $color-main // color $color-main
color #fff
padding 0 padding 0
.ivu-select-arrow .ivu-select-arrow
color $color-main color $color-main
...@@ -15,10 +16,12 @@ $color-main = #5BD5FF ...@@ -15,10 +16,12 @@ $color-main = #5BD5FF
font-size 0.8rem font-size 0.8rem
.ivu-select-item .ivu-select-item
.ivu-dropdown-item .ivu-dropdown-item
font-size 0.8rem !important font-size 1rem !important
text-align center text-align center
color $color-main color #fff
&:hover &:hover
&.ivu-select-item-selected &.ivu-select-item-selected
color #fff color #fff
background $color-main background $color-map(1)
// color $color-main
// background #fff
src/assets/css/variables.styl
View file @ c97e23b3
...@@ -4,7 +4,7 @@ $font-din = DIN, 'Avenir', Helvetica, Arial, sans-serif ...@@ -4,7 +4,7 @@ $font-din = DIN, 'Avenir', Helvetica, Arial, sans-serif
$color-map(opacity = 0.3) $color-map(opacity = 0.3)
rgba(91, 213, 255, opacity) rgba(91, 213, 255, opacity)
$color-green = #71C012 $color-green = #71C012
$gd-layout() $gd-layout(gap = 1rem)
width 100% width 100%
height 100% height 100%
background-size cover background-size cover
...@@ -12,7 +12,7 @@ $gd-layout() ...@@ -12,7 +12,7 @@ $gd-layout()
background-color #061627 background-color #061627
position relative position relative
display grid display grid
grid-gap 1rem grid-gap gap
padding 1rem padding 1rem
......
src/views/china-farming.vue
View file @ c97e23b3
<template> <template>
<div id="container" :style="`background-image: url(${require('@/assets/images/stars-bg.png')})`"> <div id="container" :style="`background-image: url(${require('@/assets/images/stars-bg.png')})`">
<ChinaMap ref="map" :data="mapData" @select="handleMapSelect"/> <ChinaMap ref="map" :data="mapData" @select="handleMapSelect" :visualConfig="visualConfig"/>
<ThemeTitle style="width: 130%;margin-left:10%;">全国稻田综合种养驾驶舱</ThemeTitle> <ThemeTitle style="width: 130%;margin-left:10%;">全国稻田综合种养驾驶舱</ThemeTitle>
<div class="year-select"> <YearSelector @select="handleYearChange" :years="years" :primaryYear="primaryYear" :secondaryYear="secondaryYear"/>
<Dropdown>
<p>
主显示
<span class="year">
2018
<Icon type="md-arrow-dropdown"></Icon>
</span>
</p>
<DropdownMenu slot="list">
<DropdownItem>2018</DropdownItem>
<DropdownItem>2017</DropdownItem>
</DropdownMenu>
</Dropdown>
<Dropdown>
<p>
对比
<span class="year">
2017
<Icon type="md-arrow-dropdown"></Icon>
</span>
</p>
<DropdownMenu slot="list">
<DropdownItem>2018</DropdownItem>
<DropdownItem>2017</DropdownItem>
</DropdownMenu>
</Dropdown>
</div>
<div class="area"> <div class="area">
<p>全国稻田综合种养面积</p> <p>{{primaryYear}}年全国稻田综合种养面积</p>
<b v-if="area"><m-flip :value="area"/></b> <b v-if="area"><m-flip :value="area"/></b>
<span>公顷</span> <span>公顷</span>
<div> <div>
...@@ -40,7 +13,7 @@ ...@@ -40,7 +13,7 @@
</div> </div>
</div> </div>
<div class="box1"> <div class="box1">
<m-card mode="2" :title="`${curCardIndex ? mapData[curCardIndex].name : '全国'}历年数据对比`"> <m-card mode="2" :title="`${!(!curCardIndex&&curCardIndex!=0) ? mapData[curCardIndex].name : '全国'}历年数据对比`">
<div class="data-wrapper"> <div class="data-wrapper">
<div> <div>
<p><span/>历年稻田综合种养面积变化（公顷）</p> <p><span/>历年稻田综合种养面积变化（公顷）</p>
...@@ -66,18 +39,24 @@ ...@@ -66,18 +39,24 @@
</template> </template>
<script> <script>
import axios from 'axios'
import ThemeTitle from './components/title' import ThemeTitle from './components/title'
import ChinaMap from './components/map' import ChinaMap from './components/map'
import AreaCard from './components/area-card' import AreaCard from './components/area-card'
import YearSelector from './components/year-selector'
export default { export default {
name: 'ChinaFarming', name: 'ChinaFarming',
components: { components: {
ThemeTitle, ThemeTitle,
ChinaMap, ChinaMap,
AreaCard, AreaCard,
YearSelector,
}, },
data() { data() {
return { return {
years: [2014, 2015, 2016, 2017, 2018],
primaryYear: 2018,
secondaryYear: 2017,
curCardIndex: null, curCardIndex: null,
area: 0, area: 0,
waterProduction: 0, waterProduction: 0,
...@@ -90,7 +69,7 @@ export default { ...@@ -90,7 +69,7 @@ export default {
bottom: '15%', bottom: '15%',
}, },
xAxis: { xAxis: {
data: ['2017', '2018'] data: [],
}, },
series: { series: {
type: 'bar', type: 'bar',
...@@ -111,7 +90,7 @@ export default { ...@@ -111,7 +90,7 @@ export default {
itemHeight: 10, itemHeight: 10,
}, },
xAxis: { xAxis: {
data: ['2017', '2018'], data: [],
}, },
series: { series: {
type: 'bar', type: 'bar',
...@@ -133,7 +112,7 @@ export default { ...@@ -133,7 +112,7 @@ export default {
itemHeight: 10, itemHeight: 10,
}, },
xAxis: { xAxis: {
data: ['2017', '2018'], data: [],
}, },
series: { series: {
type: 'bar', type: 'bar',
...@@ -142,52 +121,100 @@ export default { ...@@ -142,52 +121,100 @@ export default {
} }
}, },
data3: [], data3: [],
visualConfig: {
pieces: [
{min:0, max: 5000},
{min:5001, max: 10000},
{min:10001, max: 50000},
{min:50001, max: 100000},
{min:100001, max: 200000},
{min:200001, max: 300000},
{min:300001}
// {min:0, max: 2000},
// {min:2001, max: 4000},
// {min:4001, max: 6000},
// {min:6001, max: 8000},
// {min:8001, max: 10000},
// {min:10001, max: 20000},
// {min:20001, max: 30000},
// {min:30001, max: 100000},
// {min:100001, max: 200000},
// {min:200001, max: 300000},
// {min:300001}
]
}
} }
}, },
mounted() { mounted() {
setTimeout(() => { this.getData()
this.area = 2028262
this.waterProduction = 29598384
this.farmProduction = 2333269
this.mapData = [
{ name: '北京', value: 177, area: 100, water: 0, farm: 25962},
{ name: '天津', value: 42, area: 100, water: 638, farm: 27227},
{ name: '河北', value: 102, area: 100, water: 3783, farm: 1523},
{ name: '山西', value: 81, area: 100, water: 3783, farm: 1523},
{ name: '内蒙古', value: 17, area: 100, water: 3783, farm: 1523},
{ name: '辽宁', value: 67, area: 100, water: 3783, farm: 1523},
{ name: '吉林', value: 182, area: 100, water: 3783, farm: 1523},
{ name: '黑龙江', value: 100, area: 100, water: 3783, farm: 1523},
{ name: '上海', value: 24, area: 256897, water: 219, farm: 94293},
{ name: '江苏', value: 299, area: 100, water: 249994, farm: 325294},
{ name: '浙江', value: 114, area: 100, water: 3783, farm: 1523},
{ name: '安徽', value: 29, area: 100, water: 3783, farm: 1523},
{ name: '福建', value: 316, area: 100, water: 3783, farm: 1523},
{ name: '江西', value: 91, area: 100, water: 3783, farm: 1523},
{ name: '山东', value: 19, area: 100, water: 3783, farm: 1523},
{ name: '河南', value: 137, area: 100, water: 3783, farm: 1523},
{ name: '湖北', value: 26, area: 100, water: 690722, farm: 440298},
{ name: '湖南', value: 114, area: 100, water: 3783, farm: 1523},
{ name: '重庆', value: 91, area: 100, water: 3783, farm: 1523},
{ name: '四川', value: 25, area: 100, water: 3783, farm: 1523},
{ name: '贵州', value: 62, area: 100, water: 3783, farm: 1523},
{ name: '云南', value: 83, area: 100, water: 3783, farm: 1523},
{ name: '西藏', value: 9, area: 100, water: 3783, farm: 1523},
{ name: '陕西', value: 80, area: 100, water: 3783, farm: 1523},
{ name: '甘肃', value: 256, area: 100, water: 3783, farm: 1523},
{ name: '青海', value: 10, area: 100, water: 3783, farm: 1523},
{ name: '宁夏', value: 18, area: 100, water: 3783, farm: 1523},
{ name: '新疆', value: 67, area: 100, water: 3783, farm: 1523},
{ name: '广东', value: 123, area: 100, water: 1674, farm: 2817456},
{ name: '广西', value: 59, area: 100, water: 3783, farm: 1523},
{ name: '海南', value: 14, area: 100, water: 3783, farm: 366861},
]
this.data1 = [{data: [12345, 22345]}]
this.data2 = [{name: '稻田', data: [12345, 13345]}, {name:'淡水养殖', data:[22345, 23345]}]
this.data3 = [{name: '稻田', data: [12345, 13345]}, {name:'淡水养殖', data:[22345, 23345]}, {name: '面积', data: [12345,12345]}]
}, 1000)
}, },
methods: { methods: {
getData() {
axios.get(this.$api.FILE_URL + 'farming.json').then(res => {
const {nation, province} = res.data
this.nation = nation
this.province = province
this.transformChartData()
this.transformProvinceData()
})
},
handleYearChange(val, type) {
this[type] = val
this.transformChartData()
this.transformProvinceData()
},
calcYearLabel() {
const max = Math.max.apply(null, [this.primaryYear, this.secondaryYear])
const min = Math.min.apply(null, [this.primaryYear, this.secondaryYear])
const result = []
for(let year = min; year <= max; year++) {
result.push(year)
}
return result
},
transformChartData(flag = this.nation) {
this.area = 0
this.waterProduction = 0
this.farmProduction = 0
this.$nextTick(() => {
this.area = (this.nation.area.find(item => item.name == this.primaryYear)).value
this.waterProduction = (this.nation.water.find(item => item.name == this.primaryYear)).value
this.farmProduction = (this.nation.farm.find(item => item.name == this.primaryYear)).value
const xLabel = this.calcYearLabel()
this.options1.xAxis.data = xLabel
this.options2.xAxis.data = xLabel
this.options3.xAxis.data = xLabel
const areaData = xLabel.map(year => {
const data = flag.area.find(item => item.name == year)
return data.value || 0
})
const farmData = xLabel.map(year => {
const data = flag.farm.find(item => item.name == year)
return data.value || 0
})
const waterData = xLabel.map(year => {
const data = flag.water.find(item => item.name == year)
return data.value || 0
})
this.data1 = [{data: areaData}]
this.data2 = [{name: '稻田', data: farmData}, {name:'淡水养殖', data: waterData}]
this.data3 = [{name: '稻田', data: farmData}, {name:'淡水养殖', data: waterData}, {name: '面积', data: areaData}]
})
},
transformProvinceData() {
this.mapData = this.province.map(item => {
const areaData = (item.area.find(el => el.name == this.primaryYear)).value
const farmData = (item.farm.find(el => el.name == this.primaryYear)).value
const waterData = (item.water.find(el => el.name == this.primaryYear)).value
return {
name: item.name,
value: areaData,
area: areaData,
farm: farmData,
water: waterData
}
})
},
handleMapSelect(name) { handleMapSelect(name) {
this.curCardIndex = this.mapData.findIndex(item => item.name == name) this.curCardIndex = this.mapData.findIndex(item => item.name == name)
this.setChartData() this.setChartData()
...@@ -197,23 +224,20 @@ export default { ...@@ -197,23 +224,20 @@ export default {
if (this.curCardIndex == index) return if (this.curCardIndex == index) return
this.curCardIndex = index this.curCardIndex = index
this.setChartData() this.setChartData()
if (!index) { if (!index && index != 0) {
this.$refs.map.setRegions(index) this.$refs.map.setRegions(index)
return return
} }
this.$refs.map.setRegions(this.mapData[index].name) this.$refs.map.setRegions(this.mapData[index].name)
}, },
setChartData() { setChartData() {
if (!this.curCardIndex) { if (!this.curCardIndex && this.curCardIndex != 0) {
this.data1 = [{data: [12345, 22345]}] this.transformChartData()
this.data2 = [{name: '稻田', data: [12345, 13345]}, {name:'淡水养殖', data:[22345, 23345]}]
this.data3 = [{name: '稻田', data: [12345, 13345]}, {name:'淡水养殖', data:[22345, 23345]}, {name: '面积', data: [12345,12345]}]
return return
} }
const data = this.mapData[this.curCardIndex] const curProvince = this.mapData[this.curCardIndex].name
this.data1 = [{data: [data.area, data.area]}] const provinceData = this.province.find(item => item.name == curProvince)
this.data2 = [{name: '稻田', data: [data.farm, data.farm]}, {name:'淡水养殖', data:[data.water, data.water]}] this.transformChartData(provinceData)
this.data3 = [{name: '稻田', data: [data.farm, data.farm]}, {name:'淡水养殖', data:[data.water, data.water]}, {name: '面积', data: [data.area,data.area]}]
}, },
}, },
} }
...@@ -221,14 +245,13 @@ export default { ...@@ -221,14 +245,13 @@ export default {
<style lang="stylus" scoped> <style lang="stylus" scoped>
#container #container
$gd-layout() $gd-layout(0)
grid-template-areas \ grid-template-areas \
'. . box1'\ '. . box1'\
'. . box1'\ '. . box1'\
'box2 box2 box2' 'box2 box2 box2'
grid-template-rows 1fr 1fr 1fr grid-template-rows 1fr 1fr 1fr
grid-template-columns 1fr 1.5fr 1fr grid-template-columns 1fr 1.5fr 1fr
grid-gap 0
.box1 .box1
grid-area box1 grid-area box1
.box2 .box2
...@@ -278,17 +301,4 @@ export default { ...@@ -278,17 +301,4 @@ export default {
height 1rem height 1rem
margin-right 0.5rem margin-right 0.5rem
background $color-map(0.8) background $color-map(0.8)
.year-select
position absolute
z-index 100
top 0
right 1rem
color #fff
>div
margin-left 0.5rem
.year
color $color-map(1)
cursor pointer
font-size 1.6rem
font-weight bold
</style> </style>
src/views/china-fishing.vue
View file @ c97e23b3
<template> <template>
<div id="container" :style="`background-image: url(${require('@/assets/images/stars-bg.png')})`"> <div id="container" :style="`background-image: url(${require('@/assets/images/stars-bg.png')})`">
<ChinaMap ref="map" :data="mapData" @select="handleMapSelect" :visualFormatter="visualFormatter"/> <ChinaMap ref="map" :data="mapData" @select="handleMapSelect" :visualFormatter="visualFormatter" :visualConfig="visualConfig"/>
<ThemeTitle style="width: 130%;margin-left:10%;">全国渔业经济产值驾驶舱</ThemeTitle> <ThemeTitle style="width: 130%;margin-left:10%;">全国渔业经济产值驾驶舱</ThemeTitle>
<div class="year-select"> <YearSelector @select="handleYearChange" :years="years" :primaryYear="primaryYear" :secondaryYear="secondaryYear"/>
<Dropdown>
<p>
主显示
<span class="year">
2018
<Icon type="md-arrow-dropdown"></Icon>
</span>
</p>
<DropdownMenu slot="list">
<DropdownItem>2018</DropdownItem>
<DropdownItem>2017</DropdownItem>
</DropdownMenu>
</Dropdown>
<Dropdown>
<p>
对比
<span class="year">
2017
<Icon type="md-arrow-dropdown"></Icon>
</span>
</p>
<DropdownMenu slot="list">
<DropdownItem>2018</DropdownItem>
<DropdownItem>2017</DropdownItem>
</DropdownMenu>
</Dropdown>
</div>
<div class="area"> <div class="area">
<p>2018年渔业经济总产值</p> <p>{{primaryYear}}年渔业经济总产值</p>
<b v-if="total"><m-flip :value="total"/></b> <b v-if="total"><m-flip :value="total"/></b>
<span>元</span> <span>万元</span>
</div> </div>
<div class="box1"> <div class="box1">
<m-card mode="2" :title="`${curCardIndex ? mapData[curCardIndex].name : '全国'}产值细类`"> <m-card mode="2" :title="`${!(!curCardIndex&&curCardIndex!=0) ? mapData[curCardIndex].name : '全国'}产值细类`">
<div class="class-wrapper"> <div class="class-wrapper" v-if="primaryData && primaryData.length > 0">
<div> <div v-for="(parent, index) in primaryData" :key="parent.title">
<p class="title"><span/>渔业产值</p> <p class="title"><span/>{{parent.title}}</p>
<div> <div v-for="(item, i) in parent.list" :key="item.name">
<p>海水养殖</p> <p>{{item.name}}</p>
<p><m-count :value="2822773" :decimal="0"/> / 200% <Icon color="#B4EC51" type="md-arrow-up" /></p> <p>
<p><Progress :stroke-width="fontSize" :percent="85" stroke-color="rgba(91,213,255,1)" status="active" :hide-info="true"/></p> <m-count :value="item.value" :decimal="0"/> / {{calcRate(item.value, index, i).rate}}
</div> <Icon v-if="calcRate(item.value, index, i).isUp" color="#B4EC51" type="md-arrow-up" />
<div> <Icon v-else color="red" type="md-arrow-down" />
<p>淡水养殖</p> </p>
<p><m-count :value="2822773" :decimal="0"/> / 150% <Icon color="#B4EC51" type="md-arrow-up" /></p> <p><Progress :stroke-width="fontSize" :percent="calcPercent(item.value, parent.total)" :stroke-color="colors[index]" status="active" :hide-info="true"/></p>
<p><Progress :stroke-width="fontSize" :percent="55" stroke-color="rgba(91,213,255,1)" status="active" :hide-info="true"/></p>
</div>
<div>
<p>海洋捕捞</p>
<p><m-count :value="2822773" :decimal="0"/> / 110% <Icon color="#B4EC51" type="md-arrow-up" /></p>
<p><Progress :stroke-width="fontSize" :percent="25" stroke-color="rgb(91,213,255)" status="active" :hide-info="true"/></p>
</div>
</div>
<div>
<p class="title"><span/>渔业流通和服务业</p>
<div>
<p>水产品加工</p>
<p><m-count :value="2822773" :decimal="0"/> / 110% <Icon color="#B4EC51" type="md-arrow-up" /></p>
<p><Progress :stroke-width="fontSize" :percent="25" stroke-color="rgb(255, 206, 51)" status="active" :hide-info="true"/></p>
</div>
<div>
<p>渔用机具制造</p>
<p><m-count :value="2822773" :decimal="0"/> / 200% <Icon color="#B4EC51" type="md-arrow-up" /></p>
<p><Progress :stroke-width="fontSize" :percent="85" stroke-color="rgb(255, 206, 51)" status="active" :hide-info="true"/></p>
</div>
</div>
<div>
<p class="title"><span/>渔业工业和建筑业</p>
<div>
<p>水产流通</p>
<p><m-count :value="2822773" :decimal="0"/> / 120% <Icon color="#B4EC51" type="md-arrow-up" /></p>
<p><Progress :stroke-width="fontSize" :percent="25" stroke-color="rgb(0, 118, 254)" status="active" :hide-info="true"/></p>
</div>
<div>
<p>水产（仓储）运输</p>
<p><m-count :value="2822773" :decimal="0"/> / 200% <Icon color="#B4EC51" type="md-arrow-up" /></p>
<p><Progress :stroke-width="fontSize" :percent="75" stroke-color="rgb(0, 118, 254)" status="active" :hide-info="true"/></p>
</div>
<div>
<p>休闲渔业</p>
<p><m-count :value="2822773" :decimal="0"/> / 110% <Icon color="red" type="md-arrow-down" /></p>
<p><Progress :stroke-width="fontSize" :percent="25" stroke-color="rgb(0, 118, 254)" status="active" :hide-info="true"/></p>
</div>
<div>
<p>其他</p>
<p><m-count :value="2822773" :decimal="0"/> / 109% <Icon color="#B4EC51" type="md-arrow-up" /></p>
<p><Progress :stroke-width="fontSize" :percent="10" stroke-color="rgb(0, 118, 254)" status="active" :hide-info="true"/></p>
</div> </div>
</div> </div>
</div> </div>
</m-card> </m-card>
</div> </div>
<div class="box3"> <div class="box3">
<m-card mode="2" :title="`${curCardIndex ? mapData[curCardIndex].name : '全国'}产值分布`"> <m-card mode="2" :title="`${!(!curCardIndex&&curCardIndex!=0) ? mapData[curCardIndex].name : '全国'}产值分布`">
<div class="percent-wrapper"> <div class="percent-wrapper" v-if="primaryData && primaryData.length > 0">
<div class="flag flag1"> <div v-if="percent3 > 0" class="flag flag1" :style="`left:${percent3 <= 2 ? (percent3 + 2) : (percent3 >= 20 ? percent3 / 4 : percent3 / 1.5)}%`">
<div class="info"> <div class="info">
<p>12.98%</p> <p>渔业工业和建筑业占比：{{percent3}}%</p>
<p>渔业工业和建筑业：4395.626.98元</p> <p><m-count :value="primaryData[2].total"/>万元</p>
</div> </div>
<div class="line"/> <div class="line"/>
</div> </div>
<div class="flag flag2"> <div v-if="percent1 > 0" class="flag flag2" :style="`left:${(percent1 / 2) + (percent3 >= 40 ? percent3 / 1.2 : percent3 / 2)}%`">
<div class="line"/> <div class="line"/>
<div class="info"> <div class="info">
<p>52.01%</p> <p>渔业产值占比：{{percent1}}%</p>
<p>渔业产值：17.863.162.97元</p> <p><m-count :value="primaryData[0].total"/>万元</p>
</div> </div>
</div> </div>
<div class="flag flag3"> <div v-if="percent2 > 0" class="flag flag3" :style="`right:${percent2 <= 5 ? (percent2 + 2) : (percent2 >= 20 ? percent2 / 4.5 : percent2 / 2)}%`">
<div class="info"> <div class="info">
<p>35.01%</p> <p>渔业流通和服务业占比：{{percent2}}%</p>
<p>渔业流通和服务业：11.621.085.98元</p> <p><m-count :value="primaryData[1].total"/>万元</p>
</div> </div>
<div class="line"/> <div class="line"/>
</div> </div>
<div class="progress-container"> <div class="progress-container">
<div class="progress-bar"/> <div class="progress-bar"/>
<div class="progress-bg"/> <div class="progress-bg" :style="barBgStyle"/>
</div> </div>
</div> </div>
</m-card> </m-card>
</div> </div>
<div class="box2"> <div class="box2">
<m-card mode="2" title="各地区渔业经济产值情况"> <m-card mode="2" title="各地区渔业经济产值情况">
<area-card ref="areaCard" @select="handleCardSelect" :list="mapData"/> <area-card mode="2" ref="areaCard" @select="handleCardSelect" :list="mapData"/>
</m-card> </m-card>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import axios from 'axios'
import ThemeTitle from './components/title' import ThemeTitle from './components/title'
import ChinaMap from './components/map' import ChinaMap from './components/map'
import AreaCard from './components/area-card' import AreaCard from './components/area-card'
import YearSelector from './components/year-selector'
export default { export default {
name: 'ChinaFishing', name: 'ChinaFishing',
components: { components: {
ThemeTitle, ThemeTitle,
ChinaMap, ChinaMap,
AreaCard, AreaCard,
YearSelector,
}, },
data() { data() {
return { return {
years: [2015, 2016, 2017, 2018],
colors: ['rgb(91,213,255)', 'rgb(255, 206, 51)', 'rgb(0, 118, 254)'],
primaryYear: 2018,
secondaryYear: 2017,
curCardIndex: null, curCardIndex: null,
total: 0, total: 0,
mapData: [], mapData: [],
totalData: [],
nation: [],
province: [],
primaryData: [],
secondaryData: [],
percent1: 0,
percent2: 0,
percent3: 0,
barBgStyle: {},
visualConfig: {
pieces: [
{min:0, max: 100000},
{min:100001, max: 1000000},
{min:1000001, max: 10000000},
{min:10000001, max: 20000000},
{min:20000001, max: 30000000},
{min:30000001},
]
}
} }
}, },
mounted() { mounted() {
setTimeout(() => { this.getData()
this.total = 258644732.15
this.mapData = [
{ name: '北京', value: 177, output: 25962},
{ name: '天津', value: 42, output: 27227},
{ name: '河北', value: 102, output: 1523},
{ name: '山西', value: 81, output: 1523},
{ name: '内蒙古', value: 17, output: 1523},
{ name: '辽宁', value: 67, output: 1523},
{ name: '吉林', value: 182, output: 1523},
{ name: '黑龙江', value: 100, output: 1523},
{ name: '上海', value: 24, output: 94293},
{ name: '江苏', value: 299, output: 325294},
{ name: '浙江', value: 114, output: 1523},
{ name: '安徽', value: 29, output: 1523},
{ name: '福建', value: 316, output: 1523},
{ name: '江西', value: 91, output: 1523},
{ name: '山东', value: 19, output: 1523},
{ name: '河南', value: 137, output: 1523},
{ name: '湖北', value: 26, output: 440298},
{ name: '湖南', value: 114, output: 1523},
{ name: '重庆', value: 91, output: 1523},
{ name: '四川', value: 25, output: 1523},
{ name: '贵州', value: 62, output: 1523},
{ name: '云南', value: 83, output: 1523},
{ name: '西藏', value: 9, output: 1523},
{ name: '陕西', value: 80, output: 1523},
{ name: '甘肃', value: 256, output: 1523},
{ name: '青海', value: 10, output: 1523},
{ name: '宁夏', value: 18, output: 1523},
{ name: '新疆', value: 67, output: 1523},
{ name: '广东', value: 123, output: 2817456},
{ name: '广西', value: 59, output: 1523},
{ name: '海南', value: 14, output: 366861},
]
}, 1000)
}, },
methods: { methods: {
getData() {
axios.get(this.$api.FILE_URL + 'fishing.json').then(res => {
const {total, nation, province} = res.data
this.nation = nation
this.totalData = total
this.province = province
this.transformChartData()
this.transformProvinceData()
})
},
handleYearChange(val, type) {
this[type] = val
this.transformChartData()
this.transformProvinceData()
},
transformChartData(flag = this.nation, provinceTotal = null) {
this.total = 0
this.$nextTick(() => {
this.total = (this.totalData.find(item => item.name == this.primaryYear)).value
let totalValue = this.total
if (provinceTotal) {
totalValue = (provinceTotal.find(item => item.name == this.primaryYear)).value
}
this.primaryData = flag.map(item => {
return item.find(el => el.name == this.primaryYear)
})
this.secondaryData = flag.map(item => {
return item.find(el => el.name == this.secondaryYear)
})
for(let i=0;i<=2;i++) {
this[`percent${i + 1}`] = Number((this.primaryData[i].total * 100 / totalValue).toFixed(2))
}
this.barBgStyle = {
background: `linear-gradient(to right, rgb(0,118,254) ${this.percent3}% , rgb(91,213,255) ${this.percent3}%, rgb(91,213,255) ${this.percent1 + this.percent3}%, rgb(255,206,51) ${this.percent1 + this.percent3}%)`
}
})
},
transformProvinceData() {
this.mapData = this.province.map(item => {
const value = (item.total.find(el => el.name == this.primaryYear)).value
const second = (item.total.find(el => el.name == this.secondaryYear)).value
return {
name: item.name,
output: value,
secondaryOutput: second,
value,
}
})
},
calcRate(val, parentIndex, itemIndex) {
const second = this.secondaryData[parentIndex].list[itemIndex].value
const max = Math.max.apply(null, [val, second])
const min = Math.min.apply(null, [val, second])
return {
rate: ((max - min) * 100 / (second || 1)).toFixed(2) + '%',
isUp: val >= second,
}
},
calcPercent(val, total) {
if ((val / total) * 100 >= 100) {
return 100
}
return Number(((val / total) * 100).toFixed(2))
},
handleMapSelect(name) { handleMapSelect(name) {
this.curCardIndex = this.mapData.findIndex(item => item.name == name) this.curCardIndex = this.mapData.findIndex(item => item.name == name)
this.setChartData() this.setChartData()
...@@ -200,23 +186,20 @@ export default { ...@@ -200,23 +186,20 @@ export default {
if (this.curCardIndex == index) return if (this.curCardIndex == index) return
this.curCardIndex = index this.curCardIndex = index
this.setChartData() this.setChartData()
if (!index) { if (!index && index != 0) {
this.$refs.map.setRegions(index) this.$refs.map.setRegions(index)
return return
} }
this.$refs.map.setRegions(this.mapData[index].name) this.$refs.map.setRegions(this.mapData[index].name)
}, },
setChartData() { setChartData() {
if (!this.curCardIndex) { if (!this.curCardIndex && this.curCardIndex != 0) {
this.data1 = [{data: [12345, 22345]}] this.transformChartData()
this.data2 = [{name: '稻田', data: [12345, 13345]}, {name:'淡水养殖', data:[22345, 23345]}]
this.data3 = [{name: '稻田', data: [12345, 13345]}, {name:'淡水养殖', data:[22345, 23345]}, {name: '面积', data: [12345,12345]}]
return return
} }
const data = this.mapData[this.curCardIndex] const curProvince = this.mapData[this.curCardIndex].name
this.data1 = [{data: [data.area, data.area]}] const provinceData = this.province.find(item => item.name == curProvince)
this.data2 = [{name: '稻田', data: [data.farm, data.farm]}, {name:'淡水养殖', data:[data.water, data.water]}] this.transformChartData(provinceData.value, provinceData.total)
this.data3 = [{name: '稻田', data: [data.farm, data.farm]}, {name:'淡水养殖', data:[data.water, data.water]}, {name: '面积', data: [data.area,data.area]}]
}, },
}, },
computed: { computed: {
...@@ -239,7 +222,7 @@ export default { ...@@ -239,7 +222,7 @@ export default {
<style lang="stylus" scoped> <style lang="stylus" scoped>
$radius = 2rem $radius = 2rem
#container #container
$gd-layout() $gd-layout(0.5rem)
grid-template-areas \ grid-template-areas \
'. . box1'\ '. . box1'\
'. . box1'\ '. . box1'\
...@@ -247,7 +230,6 @@ $radius = 2rem ...@@ -247,7 +230,6 @@ $radius = 2rem
'box2 box2 box2' 'box2 box2 box2'
grid-template-rows 1fr 1fr 1fr 1fr grid-template-rows 1fr 1fr 1fr 1fr
grid-template-columns 1fr 1fr 1.2fr grid-template-columns 1fr 1fr 1.2fr
grid-gap 0.5rem
.box1 .box1
grid-area box1 grid-area box1
.box2 .box2
...@@ -260,7 +242,7 @@ $radius = 2rem ...@@ -260,7 +242,7 @@ $radius = 2rem
color $color-map(1) color $color-map(1)
position absolute position absolute
top 10% top 10%
left 0 left 3%
right 0 right 0
text-align center text-align center
>div >div
...@@ -326,6 +308,8 @@ $radius = 2rem ...@@ -326,6 +308,8 @@ $radius = 2rem
background $color-map(1) background $color-map(1)
>div >div
margin-bottom 0.5rem margin-bottom 0.5rem
line-height 1.4rem
.percent-wrapper .percent-wrapper
display flex display flex
align-items center align-items center
...@@ -341,23 +325,20 @@ $radius = 2rem ...@@ -341,23 +325,20 @@ $radius = 2rem
width 0.1rem width 0.1rem
height 1.5rem height 1.5rem
&.flag1 &.flag1
left 5%
.line .line
background rgba(0,118,254,0.8) background rgba(0,118,254,0.8)
.info .info
border-bottom 0.1rem solid rgba(0,118,254,0.8) border-bottom 0.1rem solid rgba(0,118,254,0.8)
&.flag2 &.flag2
top 55% top 55%
left 30%
.line .line
background rgba(91,213,255,0.8) background rgba(91,213,255,0.8)
.info .info
border-top 0.1rem solid rgba(91,213,255,0.8) border-top 0.1rem solid rgba(91,213,255,0.8)
&.flag3 &.flag3
left 55%
.line .line
background rgba(255,206,51,0.8) background rgba(255,206,51,0.8)
margin-left 30% margin-left 100%
.info .info
border-bottom 0.1rem solid rgba(255,206,51,0.8) border-bottom 0.1rem solid rgba(255,206,51,0.8)
.progress-container .progress-container
...@@ -377,8 +358,8 @@ $radius = 2rem ...@@ -377,8 +358,8 @@ $radius = 2rem
opacity 0.2 opacity 0.2
background-size 100% background-size 100%
background-image repeating-linear-gradient(45deg, transparent, transparent 0.6rem, #fff 0.6rem, #fff 0.8rem) background-image repeating-linear-gradient(45deg, transparent, transparent 0.6rem, #fff 0.6rem, #fff 0.8rem)
&.progress-bg // &.progress-bg
background linear-gradient(to right, rgb(0,118,254) 12.89% , rgb(91,213,255) 12.89%, rgb(91,213,255) 64.9%, rgb(255,206,51) 64.9%) // background linear-gradient(to right, rgb(0,118,254) 12.89% , rgb(91,213,255) 12.89%, rgb(91,213,255) 64.9%, rgb(255,206,51) 64.9%)
</style> </style>
<style lang="stylus"> <style lang="stylus">
......
src/views/components/area-card.vue
View file @ c97e23b3
...@@ -3,14 +3,17 @@ ...@@ -3,14 +3,17 @@
<template v-if="list && list.length > 0"> <template v-if="list && list.length > 0">
<div v-for="(item, index) in list" :key="item.name"> <div v-for="(item, index) in list" :key="item.name">
<div :class="`area-card ${index === curIndex ? 'on' : ''}`" @click="handleSelect(index)"> <div :class="`area-card ${index === curIndex ? 'on' : ''}`" @click="handleSelect(index)">
<i-circle :trail-color="switchColor(item.value).trail" :stroke-color="switchColor(item.value).stroke" :percent="item.value" :size="size"> <i-circle v-if="mode == 1" :trail-color="switchColor(calcPercent(item)).trail" :stroke-color="switchColor(calcPercent(item)).stroke" :percent="calcPercent(item)" :size="size">
<span style="font-size:0.8rem">{{item.value | pipe}}</span> <span style="font-size:0.8rem;">{{calcPercent(item) | pipe}}</span>
</i-circle>
<i-circle v-if="mode == 2" :trail-color="switchColor(calcPercent2(item).value).trail" :stroke-color="switchColor(calcPercent2(item).value).stroke" :percent="item.value" :size="size">
<span :style="`font-size:0.8rem;color:${calcPercent2(item).isUp ? '#B4EC51' : 'red'}`">{{calcPercent2(item).value | pipe}}</span>
</i-circle> </i-circle>
<div> <div>
<p>{{item.name}}</p> <p>{{item.name}}</p>
<p v-if="item.output"><b><m-count :value="item.output"/></b><i>万元</i></p> <p v-if="mode == 1"><b><m-count :value="item.area" :decimal="0"/></b><i>公顷</i></p>
<p v-if="item.area"><b><m-count :value="item.area" :decimal="0"/></b><i>公顷</i></p> <p v-if="mode == 1"><b><m-count :value="item.farm" :decimal="0"/></b>/<b><m-count :value="item.water" :decimal="0"/></b><i>吨</i></p>
<p v-if="item.water || item.farm"><b><m-count :value="item.water" :decimal="0"/></b> / <b><m-count :value="item.farm" :decimal="0"/></b><i>吨</i></p> <p v-if="mode == 2"><b><m-count :value="item.output"/></b><i>万元</i></p>
</div> </div>
</div> </div>
</div> </div>
...@@ -27,7 +30,11 @@ export default { ...@@ -27,7 +30,11 @@ export default {
default() { default() {
return [] return []
} }
} },
mode: {
type: [String, Number],
default: '1',
},
}, },
data() { data() {
return { return {
...@@ -43,33 +50,44 @@ export default { ...@@ -43,33 +50,44 @@ export default {
} }
this.$emit('select', this.curIndex) this.$emit('select', this.curIndex)
}, },
calcPercent({farm, water}) {
return Number(((farm / water) * 100).toFixed(1))
},
calcPercent2({output, secondaryOutput}) {
const max = Math.max.apply(null, [output, secondaryOutput])
const min = Math.min.apply(null, [output, secondaryOutput])
return {
value: Number(((max - min) * 100 / (secondaryOutput || 1)).toFixed(1)),
isUp: output >= secondaryOutput,
}
},
switchColor(val) { switchColor(val) {
if (val <= 20) { if (val <= 5) {
return { return {
stroke: '#DBF6FF', stroke: '#DBF6FF',
trail: '#85CDFF', trail: '#85CDFF',
} }
} else if (val <= 35) { } else if (val <= 10) {
return { return {
stroke: '#5BD5FF', stroke: '#5BD5FF',
trail: '#0076FF', trail: '#0076FF',
} }
} else if (val <= 50) { } else if (val <= 15) {
return { return {
stroke: '#8ED617', stroke: '#8ED617',
trail: '#3F772F', trail: '#3F772F',
} }
} else if (val <= 65) { } else if (val <= 20) {
return { return {
stroke: '#FFCE34', stroke: '#FFCE34',
trail: '#E06536', trail: '#E06536',
} }
} else if (val <= 80) { } else if (val <= 25) {
return { return {
stroke: '#FF6161', stroke: '#FF6161',
trail: '#A02929', trail: '#A02929',
} }
} else if (val <= 100) { } else if (val <= 30) {
return { return {
stroke: '#8623EB', stroke: '#8623EB',
trail: '#C691FF', trail: '#C691FF',
...@@ -80,12 +98,13 @@ export default { ...@@ -80,12 +98,13 @@ export default {
trail: '#C691FF', trail: '#C691FF',
} }
} }
} },
}, },
filters: { filters: {
pipe(val) { pipe(val) {
const result = val > 100 ? 100 : val const result = val > 100 ? 100 : val
return `${result}%` // return `${result}%`
return result
} }
}, },
computed: { computed: {
......
src/views/components/map.vue
View file @ c97e23b3
...@@ -101,11 +101,13 @@ export default { ...@@ -101,11 +101,13 @@ export default {
itemStyle: { itemStyle: {
normal: { normal: {
areaColor: 'rgba(0, 191, 255, 0.1)', areaColor: 'rgba(0, 191, 255, 0.1)',
borderColor: 'rgba(0, 191, 255, 0.6)', borderColor: 'rgba(0, 191, 255, 0.9)',
borderWidth: 0.4, borderWidth: 0.4,
}, },
emphasis: { emphasis: {
areaColor: '#5ad4ff', // areaColor: '#5ad4ff',
areaColor: 'rgba(0, 191, 255, 0.9)',
// areaColor: 'rgba(91, 213, 255, 0.9)',
color: '#fff' color: '#fff'
} }
}, },
...@@ -145,7 +147,6 @@ export default { ...@@ -145,7 +147,6 @@ export default {
selected: true, selected: true,
itemStyle: { itemStyle: {
areaColor: '#5ad4ff', areaColor: '#5ad4ff',
color: 'red',
shadowColor: 'rgba(0, 0, 0, 1)', shadowColor: 'rgba(0, 0, 0, 1)',
shadowBlur: 10, shadowBlur: 10,
shadowOffsetY: 10, shadowOffsetY: 10,
...@@ -176,7 +177,7 @@ export default { ...@@ -176,7 +177,7 @@ export default {
show: false, show: false,
inRange: { inRange: {
opacity: 0.5, opacity: 0.5,
color: ['rgba(91, 213, 255, 0.1)', 'rgba(91, 213, 255, 0.6)'] color: ['rgba(91, 213, 255, 0.1)', 'rgba(91, 213, 255, 0.8)']
} }
}, this.visualConfig) }, this.visualConfig)
this.map.setOption(this.config) this.map.setOption(this.config)
...@@ -203,5 +204,5 @@ export default { ...@@ -203,5 +204,5 @@ export default {
.bar .bar
width 2rem width 2rem
height 6rem height 6rem
background linear-gradient(to bottom, rgba(91, 213, 255, 0.6), rgba(91, 213, 255, 0.1)) background linear-gradient(to bottom, rgba(91, 213, 255, 0.8), rgba(91, 213, 255, 0.1))
</style> </style>
src/views/components/year-selector.vue 0 → 100644
View file @ c97e23b3
<template>
<div class="year-select">
<Dropdown @on-click="handleChange($event, 'primaryYear')">
<p>
主显示
<span class="year">
{{primaryYear}}
<Icon type="md-arrow-dropdown"></Icon>
</span>
</p>
<DropdownMenu slot="list">
<DropdownItem :class="year == primaryYear ? 'ivu-select-item-selected' : ''" v-for="year in years" :key="year" :name="year">{{year}}</DropdownItem>
</DropdownMenu>
</Dropdown>
<Dropdown @on-click="handleChange($event, 'secondaryYear')">
<p>
对比
<span class="year">
{{secondaryYear}}
<Icon type="md-arrow-dropdown"></Icon>
</span>
</p>
<DropdownMenu slot="list">
<DropdownItem :class="year == secondaryYear ? 'ivu-select-item-selected' : ''" v-for="year in years" :key="year" :name="year">{{year}}</DropdownItem>
</DropdownMenu>
</Dropdown>
</div>
</template>
<script>
export default {
name: 'YearSelector',
props: {
years: {
type: Array,
default() {
return []
}
},
primaryYear: {
type: [Number, String],
default: 2018,
},
secondaryYear: {
type: [Number, String],
default: 2017,
},
},
methods: {
handleChange(val, type) {
this.$emit('select', val, type)
},
},
}
</script>
<style lang="stylus" scoped>
.year-select
position absolute
z-index 100
top 0
right 1rem
color #fff
>div
margin-left 0.5rem
.year
color $color-map(1)
cursor pointer
font-size 1.6rem
font-weight bold
</style>
static/farming.json 0 → 100644
View file @ c97e23b3
{
"nation": {
"area": [
{"name": 2014, "value": 1489501, "unit": "公顷"},
{"name": 2015, "value": 1501629, "unit": "公顷"},
{"name": 2016, "value": 1484001, "unit": "公顷"},
{"name": 2017, "value": 1682689, "unit": "公顷"},
{"name": 2018, "value": 2028262, "unit": "公顷"}
],
"water": [
{"name":2014, "value": 29357591, "unit": "吨"},
{"name":2015, "value": 30622735, "unit": "吨"},
{"name":2016, "value": 28778881, "unit": "吨"},
{"name":2017, "value": 29052930, "unit": "吨"},
{"name":2018, "value": 29598384, "unit": "吨"}
],
"farm": [
{"name":2014, "value":1456719, "unit": "吨"},
{"name":2015, "value":1558187, "unit": "吨"},
{"name":2016, "value":1628361, "unit": "吨"},
{"name":2017, "value":1947507, "unit": "吨"},
{"name":2018, "value":2333269, "unit": "吨"}
]
},
"province": [
{"name": "北京", "area": [
{"name": 2014, "value":0},
{"name": 2015, "value":4},
{"name": 2016, "value":0},
{"name": 2017, "value":0},
{"name": 2018, "value":0}
], "water": [
{"name": 2014, "value":50871},
{"name": 2015, "value":45043},
{"name": 2016, "value":37423},
{"name": 2017, "value":33082},
{"name": 2018, "value":25962}
], "farm": [
{"name": 2014, "value": 0},
{"name": 2015, "value":1},
{"name": 2016, "value":0},
{"name": 2017, "value": 0},
{"name": 2018, "value": 0}
]},
{"name": "天津", "area": [
{"name": 2014, "value":1067},
{"name": 2015, "value":2993},
{"name": 2016, "value":2783},
{"name": 2017, "value":2784},
{"name": 2018, "value":3285}
], "water": [
{"name": 2014, "value":319311},
{"name": 2015, "value":313012},
{"name": 2016, "value":259368},
{"name": 2017, "value":269198},
{"name": 2018, "value":272228}
], "farm": [
{"name": 2014, "value": 320},
{"name": 2015, "value":438},
{"name": 2016, "value":421},
{"name": 2017, "value": 515},
{"name": 2018, "value": 638}
]},
{"name": "河北", "area": [
{"name": 2014, "value":1903},
{"name": 2015, "value":1228},
{"name": 2016, "value":1100},
{"name": 2017, "value":1483},
{"name": 2018, "value":2423}
], "water": [
{"name": 2014, "value":430667},
{"name": 2015, "value":433425},
{"name": 2016, "value":329400},
{"name": 2017, "value":304175},
{"name": 2018, "value":286351}
], "farm": [
{"name": 2014, "value": 876},
{"name": 2015, "value":455},
{"name": 2016, "value":249},
{"name": 2017, "value": 569},
{"name": 2018, "value": 1249}
]},
{"name": "山西", "area": [
{"name": 2014, "value":266},
{"name": 2015, "value":266},
{"name": 2016, "value":266},
{"name": 2017, "value":267},
{"name": 2018, "value":266}
], "water": [
{"name": 2014, "value":50188},
{"name": 2015, "value":51353},
{"name": 2016, "value":51138},
{"name": 2017, "value":50905},
{"name": 2018, "value":45451}
], "farm": [
{"name": 2014, "value": 140},
{"name": 2015, "value":140},
{"name": 2016, "value":140},
{"name": 2017, "value": 140},
{"name": 2018, "value": 140}
]},
{"name": "内蒙古", "area": [
{"name": 2014, "value":3235},
{"name": 2015, "value":2906},
{"name": 2016, "value":4185},
{"name": 2017, "value":4504},
{"name": 2018, "value":6326}
], "water": [
{"name": 2014, "value":118031},
{"name": 2015, "value":124161},
{"name": 2016, "value":128995},
{"name": 2017, "value":127827},
{"name": 2018, "value":118179}
], "farm": [
{"name": 2014, "value": 435},
{"name": 2015, "value":474},
{"name": 2016, "value":494},
{"name": 2017, "value": 235},
{"name": 2018, "value": 301}
]},
{"name": "辽宁", "area": [
{"name": 2014, "value":104962},
{"name": 2015, "value":81544},
{"name": 2016, "value":60588},
{"name": 2017, "value":51773},
{"name": 2018, "value":51509}
], "water": [
{"name": 2014, "value":904206},
{"name": 2015, "value":936990},
{"name": 2016, "value":830200},
{"name": 2017, "value":830000},
{"name": 2018, "value":798728}
], "farm": [
{"name": 2014, "value": 68428},
{"name": 2015, "value":53089},
{"name": 2016, "value":53129},
{"name": 2017, "value": 47101},
{"name": 2018, "value": 52109}
]},
{"name": "吉林", "area": [
{"name": 2014, "value":5897},
{"name": 2015, "value":8187},
{"name": 2016, "value":12564},
{"name": 2017, "value":25278},
{"name": 2018, "value":33171}
], "water": [
{"name": 2014, "value":169468},
{"name": 2015, "value":175546},
{"name": 2016, "value":181200},
{"name": 2017, "value":201046},
{"name": 2018, "value":214790}
], "farm": [
{"name": 2014, "value": 906},
{"name": 2015, "value":1499},
{"name": 2016, "value":2411},
{"name": 2017, "value": 5256},
{"name": 2018, "value": 7740}
]},
{"name": "黑龙江", "area": [
{"name": 2014, "value":15065},
{"name": 2015, "value":31898},
{"name": 2016, "value":23593},
{"name": 2017, "value":33345},
{"name": 2018, "value":47000}
], "water": [
{"name": 2014, "value":459396},
{"name": 2015, "value":485199},
{"name": 2016, "value":503300},
{"name": 2017, "value":535662},
{"name": 2018, "value":577220}
], "farm": [
{"name": 2014, "value": 4287},
{"name": 2015, "value":4317},
{"name": 2016, "value":4658},
{"name": 2017, "value": 5585},
{"name": 2018, "value": 7580}
]},
{"name": "上海", "area": [
{"name": 2014, "value":12},
{"name": 2015, "value":24},
{"name": 2016, "value":43},
{"name": 2017, "value":62},
{"name": 2018, "value":75}
], "water": [
{"name": 2014, "value":157468},
{"name": 2015, "value":151289},
{"name": 2016, "value":125800},
{"name": 2017, "value":122750},
{"name": 2018, "value":94293}
], "farm": [
{"name": 2014, "value": 3},
{"name": 2015, "value":110},
{"name": 2016, "value":166},
{"name": 2017, "value": 185},
{"name": 2018, "value": 219}
]},
{"name": "江苏", "area": [
{"name": 2014, "value":117676},
{"name": 2015, "value":109758},
{"name": 2016, "value":110758},
{"name": 2017, "value":131802},
{"name": 2018, "value":241058}
], "water": [
{"name": 2014, "value":3357919},
{"name": 2015, "value":3403218},
{"name": 2016, "value":3303816},
{"name": 2017, "value":3281006},
{"name": 2018, "value":3252943}
], "farm": [
{"name": 2014, "value": 207721},
{"name": 2015, "value":197876},
{"name": 2016, "value":189709},
{"name": 2017, "value": 188631},
{"name": 2018, "value": 249994}
]},
{"name": "浙江", "area": [
{"name": 2014, "value":75424},
{"name": 2015, "value":83060},
{"name": 2016, "value":77164},
{"name": 2017, "value":73134},
{"name": 2018, "value":46434}
], "water": [
{"name": 2014, "value":977452},
{"name": 2015, "value":1019515},
{"name": 2016, "value":1051271},
{"name": 2017, "value":1107271},
{"name": 2018, "value":1133036}
], "farm": [
{"name": 2014, "value": 301796},
{"name": 2015, "value":339186},
{"name": 2016, "value":343931},
{"name": 2017, "value": 286614},
{"name": 2018, "value": 134876}
]},
{"name": "安徽", "area": [
{"name": 2014, "value":52894},
{"name": 2015, "value":54882},
{"name": 2016, "value":64661},
{"name": 2017, "value":84769},
{"name": 2018, "value":150636}
], "water": [
{"name": 2014, "value":1908408},
{"name": 2015, "value":1987873},
{"name": 2016, "value":1862600},
{"name": 2017, "value":1901124},
{"name": 2018, "value":1990499}
], "farm": [
{"name": 2014, "value": 79173},
{"name": 2015, "value":83069},
{"name": 2016, "value":100273},
{"name": 2017, "value": 102347},
{"name": 2018, "value": 218811}
]},
{"name": "福建", "area": [
{"name": 2014, "value":18623},
{"name": 2015, "value":18492},
{"name": 2016, "value":15600},
{"name": 2017, "value":15335},
{"name": 2018, "value":15914}
], "water": [
{"name": 2014, "value":837089},
{"name": 2015, "value":888147},
{"name": 2016, "value":711802},
{"name": 2017, "value":752232},
{"name": 2018, "value":800880}
], "farm": [
{"name": 2014, "value": 15449},
{"name": 2015, "value":15538},
{"name": 2016, "value":12303},
{"name": 2017, "value": 12688},
{"name": 2018, "value": 15850}
]},
{"name": "江西", "area": [
{"name": 2014, "value":63429},
{"name": 2015, "value":64112},
{"name": 2016, "value":34972},
{"name": 2017, "value":50397},
{"name": 2018, "value":66996}
], "water": [
{"name": 2014, "value":2276781},
{"name": 2015, "value":2378446},
{"name": 2016, "value":2194139},
{"name": 2017, "value":2279506},
{"name": 2018, "value":2335443}
], "farm": [
{"name": 2014, "value": 67922},
{"name": 2015, "value":68092},
{"name": 2016, "value":68402},
{"name": 2017, "value": 81565},
{"name": 2018, "value": 97950}
]},
{"name": "山东", "area": [
{"name": 2014, "value":595},
{"name": 2015, "value":1738},
{"name": 2016, "value":1819},
{"name": 2017, "value":2020},
{"name": 2018, "value":2298}
], "water": [
{"name": 2014, "value":1464056},
{"name": 2015, "value":1463072},
{"name": 2016, "value":1263770},
{"name": 2017, "value":1224573},
{"name": 2018, "value":1170526}
], "farm": [
{"name": 2014, "value": 2242},
{"name": 2015, "value":2497},
{"name": 2016, "value":2061},
{"name": 2017, "value": 2230},
{"name": 2018, "value": 6580}
]},
{"name": "河南", "area": [
{"name": 2014, "value":762},
{"name": 2015, "value":1335},
{"name": 2016, "value":1289},
{"name": 2017, "value":15820},
{"name": 2018, "value":33709}
], "water": [
{"name": 2014, "value":868330},
{"name": 2015, "value":972600},
{"name": 2016, "value":895500},
{"name": 2017, "value":835250},
{"name": 2018, "value":875496}
], "farm": [
{"name": 2014, "value": 554},
{"name": 2015, "value":1347},
{"name": 2016, "value":1659},
{"name": 2017, "value": 7436},
{"name": 2018, "value": 19260}
]},
{"name": "湖北", "area": [
{"name": 2014, "value":192600},
{"name": 2015, "value":200863},
{"name": 2016, "value":253863},
{"name": 2017, "value":334890},
{"name": 2018, "value":393171}
], "water": [
{"name": 2014, "value":4124940},
{"name": 2015, "value":4367861},
{"name": 2016, "value":4518227},
{"name": 2017, "value":4361261},
{"name": 2018, "value":4402981}
], "farm": [
{"name": 2014, "value": 219866},
{"name": 2015, "value":256611},
{"name": 2016, "value":289592},
{"name": 2017, "value": 516984},
{"name": 2018, "value": 690722}
]},
{"name": "湖南", "area": [
{"name": 2014, "value":165616},
{"name": 2015, "value":171369},
{"name": 2016, "value":181934},
{"name": 2017, "value":221524},
{"name": 2018, "value":300148}
], "water": [
{"name": 2014, "value":2373876},
{"name": 2015, "value":2484837},
{"name": 2016, "value":2288600},
{"name": 2017, "value":2320384},
{"name": 2018, "value":2379514}
], "farm": [
{"name": 2014, "value": 69498},
{"name": 2015, "value":81388},
{"name": 2016, "value":98209},
{"name": 2017, "value": 190218},
{"name": 2018, "value": 298049}
]},
{"name": "广东", "area": [
{"name": 2014, "value":3375},
{"name": 2015, "value":3364},
{"name": 2016, "value":3038},
{"name": 2017, "value":3293},
{"name": 2018, "value":3643}
], "water": [
{"name": 2014, "value":3731574},
{"name": 2015, "value":3865638},
{"name": 2016, "value":3646338},
{"name": 2017, "value":3696884},
{"name": 2018, "value":3817456}
], "farm": [
{"name": 2014, "value": 2808},
{"name": 2015, "value":2440},
{"name": 2016, "value":2300},
{"name": 2017, "value": 2920},
{"name": 2018, "value": 1674}
]},
{"name": "广西", "area": [
{"name": 2014, "value":45155},
{"name": 2015, "value":45415},
{"name": 2016, "value":46344},
{"name": 2017, "value":47670},
{"name": 2018, "value":45414}
], "water": [
{"name": 2014, "value":1444993},
{"name": 2015, "value":1523681},
{"name": 2016, "value":1128329},
{"name": 2017, "value":1184068},
{"name": 2018, "value":1282698}
], "farm": [
{"name": 2014, "value": 15716},
{"name": 2015, "value":16900},
{"name": 2016, "value":18329},
{"name": 2017, "value": 19929},
{"name": 2018, "value": 25275}
]},
{"name": "海南", "area": [
{"name": 2014, "value":0},
{"name": 2015, "value":0},
{"name": 2016, "value":0},
{"name": 2017, "value":0},
{"name": 2018, "value":69}
], "water": [
{"name": 2014, "value":462111},
{"name": 2015, "value":405869},
{"name": 2016, "value":347905},
{"name": 2017, "value":345751},
{"name": 2018, "value":366861}
], "farm": [
{"name": 2014, "value": 0},
{"name": 2015, "value":0},
{"name": 2016, "value":0},
{"name": 2017, "value": 0},
{"name": 2018, "value": 212}
]},
{"name": "重庆", "area": [
{"name": 2014, "value":37345},
{"name": 2015, "value":36785},
{"name": 2016, "value":34271},
{"name": 2017, "value":33719},
{"name": 2018, "value":35295}
], "water": [
{"name": 2014, "value":423076},
{"name": 2015, "value":460505},
{"name": 2016, "value":470917},
{"name": 2017, "value":496187},
{"name": 2018, "value":510746}
], "farm": [
{"name": 2014, "value": 8351},
{"name": 2015, "value":8332},
{"name": 2016, "value":8249},
{"name": 2017, "value": 8177},
{"name": 2018, "value": 9376}
]},
{"name": "四川", "area": [
{"name": 2014, "value":306928},
{"name": 2015, "value":308938},
{"name": 2016, "value":308529},
{"name": 2017, "value":309643},
{"name": 2018, "value":312230}
], "water": [
{"name": 2014, "value":1266189},
{"name": 2015, "value":1327202},
{"name": 2016, "value":1364653},
{"name": 2017, "value":1453613},
{"name": 2018, "value":1489358}
], "farm": [
{"name": 2014, "value": 310612},
{"name": 2015, "value":330956},
{"name": 2016, "value":350853},
{"name": 2017, "value": 377784},
{"name": 2018, "value": 383431}
]},
{"name": "贵州", "area": [
{"name": 2014, "value":151009},
{"name": 2015, "value":153126},
{"name": 2016, "value":125550},
{"name": 2017, "value":121055},
{"name": 2018, "value":119624}
], "water": [
{"name": 2014, "value":196040},
{"name": 2015, "value":235860},
{"name": 2016, "value":234900},
{"name": 2017, "value":243262},
{"name": 2018, "value":226382}
], "farm": [
{"name": 2014, "value": 36005},
{"name": 2015, "value":43977},
{"name": 2016, "value":37494},
{"name": 2017, "value": 41626},
{"name": 2018, "value": 45581}
]},
{"name": "云南", "area": [
{"name": 2014, "value":113417},
{"name": 2015, "value":111392},
{"name": 2016, "value":112544},
{"name": 2017, "value":112349},
{"name": 2018, "value":111947}
], "water": [
{"name": 2014, "value":535132},
{"name": 2015, "value":638960},
{"name": 2016, "value":548206},
{"name": 2017, "value":575233},
{"name": 2018, "value":606376}
], "farm": [
{"name": 2014, "value": 41569},
{"name": 2015, "value":48553},
{"name": 2016, "value":42739},
{"name": 2017, "value": 48068},
{"name": 2018, "value": 64543}
]},
{"name": "西藏", "area": [
{"name": 2014, "value":0},
{"name": 2015, "value":0},
{"name": 2016, "value":0},
{"name": 2017, "value":0},
{"name": 2018, "value":0}
], "water": [
{"name": 2014, "value":61},
{"name": 2015, "value":61},
{"name": 2016, "value":80},
{"name": 2017, "value":71},
{"name": 2018, "value":43}
], "farm": [
{"name": 2014, "value": 0},
{"name": 2015, "value":0},
{"name": 2016, "value":0},
{"name": 2017, "value": 0},
{"name": 2018, "value": 0}
]},
{"name": "陕西", "area": [
{"name": 2014, "value":859},
{"name": 2015, "value":3147},
{"name": 2016, "value":3155},
{"name": 2017, "value":3155},
{"name": 2018, "value":3155}
], "water": [
{"name": 2014, "value":133320},
{"name": 2015, "value":147960},
{"name": 2016, "value":151780},
{"name": 2017, "value":155830},
{"name": 2018, "value":155835}
], "farm": [
{"name": 2014, "value": 170},
{"name": 2015, "value":174},
{"name": 2016, "value":160},
{"name": 2017, "value": 160},
{"name": 2018, "value": 160}
]},
{"name": "甘肃", "area": [
{"name": 2014, "value":0},
{"name": 2015, "value":6},
{"name": 2016, "value":2},
{"name": 2017, "value":3},
{"name": 2018, "value":0}
], "water": [
{"name": 2014, "value":14476},
{"name": 2015, "value":14932},
{"name": 2016, "value":15333},
{"name": 2017, "value":15441},
{"name": 2018, "value":14136}
], "farm": [
{"name": 2014, "value": 1},
{"name": 2015, "value":1},
{"name": 2016, "value":1},
{"name": 2017, "value": 1},
{"name": 2018, "value": 1}
]},
{"name": "青海", "area": [
{"name": 2014, "value":0},
{"name": 2015, "value":0},
{"name": 2016, "value":0},
{"name": 2017, "value":0},
{"name": 2018, "value":0}
], "water": [
{"name": 2014, "value":9037},
{"name": 2015, "value":10578},
{"name": 2016, "value":12050},
{"name": 2017, "value":16073},
{"name": 2018, "value":17116}
], "farm": [
{"name": 2014, "value": 0},
{"name": 2015, "value":0},
{"name": 2016, "value":0},
{"name": 2017, "value": 0},
{"name": 2018, "value": 0}
]},
{"name": "宁夏", "area": [
{"name": 2014, "value":11387},
{"name": 2015, "value":4797},
{"name": 2016, "value":2890},
{"name": 2017, "value":1757},
{"name": 2018, "value":2166}
], "water": [
{"name": 2014, "value":162244},
{"name": 2015, "value":169335},
{"name": 2016, "value":174175},
{"name": 2017, "value":180460},
{"name": 2018, "value":176555}
], "farm": [
{"name": 2014, "value": 1871},
{"name": 2015, "value":697},
{"name": 2016, "value":371},
{"name": 2017, "value": 505},
{"name": 2018, "value": 897}
]},
{"name": "新疆", "area": [
{"name": 2014, "value":0},
{"name": 2015, "value":0},
{"name": 2016, "value":496},
{"name": 2017, "value":858},
{"name": 2018, "value":300}
], "water": [
{"name": 2014, "value":130881},
{"name": 2015, "value":140567},
{"name": 2016, "value":147666},
{"name": 2017, "value":152805},
{"name": 2018, "value":160302}
], "farm": [
{"name": 2014, "value": 0},
{"name": 2015, "value":30},
{"name": 2016, "value":58},
{"name": 2017, "value": 38},
{"name": 2018, "value": 51}
]}
]
}
static/fishing.json 0 → 100644
View file @ c97e23b3
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment