new-map
ihzero 2022-11-07 13:36:02 +08:00
parent 1bee2f93d1
commit 5162630acc
5 changed files with 28 additions and 15 deletions

View File

@ -13,6 +13,7 @@
import Box from './Box.vue' import Box from './Box.vue'
import { computed } from '@vue/reactivity' import { computed } from '@vue/reactivity'
import { chartBarColors, chartLineColors } from './colors' import { chartBarColors, chartLineColors } from './colors'
import { useVisualizationStore } from '/@/store/modules/visualization'
export default defineComponent({ export default defineComponent({
components: { components: {
Box, Box,
@ -26,6 +27,7 @@
}, },
}, },
setup(props) { setup(props) {
const visualizationStore = useVisualizationStore()
const propsData: any = computed(() => props.data) const propsData: any = computed(() => props.data)
const chartRef = ref<HTMLDivElement | null>(null) const chartRef = ref<HTMLDivElement | null>(null)
@ -41,6 +43,7 @@
if (!id) return if (!id) return
const resData = await getCropYieldQuarterStatics({ const resData = await getCropYieldQuarterStatics({
crop_id: id, crop_id: id,
year: visualizationStore.getYear,
}) })
const list: any[] = [] const list: any[] = []
for (const key in resData) { for (const key in resData) {

View File

@ -137,7 +137,6 @@
const tabChange = () => { const tabChange = () => {
const { is_end, id } = currentTab.value const { is_end, id } = currentTab.value
console.log(id)
if (is_end == 0) { if (is_end == 0) {
childParentId.value = id childParentId.value = id
@ -193,7 +192,7 @@
setOptions({ setOptions({
grid: { left: '2%', right: '2%', top: '10%', bottom: '2%', containLabel: true }, grid: { left: '2%', right: '2%', top: '10%', bottom: '2%', containLabel: true },
legend: { legend: {
show: false, show: true,
data: obj.legendData, data: obj.legendData,
top: '0%', top: '0%',
right: '0', right: '0',
@ -249,7 +248,7 @@
// const // const
const resData = await getCates({ const resData = await getCates({
parent_id: props.parentId, parent_id: props.parentId,
crop_type: 1, crop_type: 2,
category_id: cropsId.value, category_id: cropsId.value,
type: 'top', type: 'top',
}) })

View File

@ -105,8 +105,16 @@
data: diffs, data: diffs,
}) })
}) })
setOptions({ setOptions({
grid: { left: '2%', right: '2%', top: '3%', bottom: '2%', containLabel: true }, grid: { left: '2%', right: '2%', top: '50px', bottom: '2%', containLabel: true },
legend: {
show: true,
data: obj.legendData,
textStyle: {
color: '#ffffff',
},
},
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
@ -116,13 +124,16 @@
}, },
}, },
formatter: function (params) { formatter: function (params) {
const arr = [] let str = params[0]?.name + '<br/>'
params.forEach((e, index) => { params.forEach((e, index) => {
if (index % 2) arr.push(e) if (index % 2)
}) str +=
let str = '' e.seriesName +
arr.forEach((e: any) => { ' : ' +
str += e.name + '<br/>' + e.seriesName + ' : ' + (e?.value ?? 0) (params[index - 1]?.value ?? 0) +
'-' +
(Number(e?.value ?? 0) + Number(params[index - 1]?.value ?? 0)) +
'<br>'
}) })
return str return str
}, },

View File

@ -5,7 +5,7 @@
> >
历年产值趋势 历年产值趋势
</div> </div>
<div class="h-220px mt-10px" ref="chartRef"> 1 </div> <div class="h-220px mt-10px" ref="chartRef"> </div>
</div> </div>
</template> </template>
@ -101,7 +101,7 @@
for (const key in list) { for (const key in list) {
if (Object.prototype.hasOwnProperty.call(list, key)) { if (Object.prototype.hasOwnProperty.call(list, key)) {
arr.push({ arr.push({
y: Number(list[key]) / 10000, y: Number((Number(list[key]) / 10000).toFixed(2)),
x: key, x: key,
}) })
} }

View File

@ -36,9 +36,9 @@
<SBYXZT class="mt-16px" width="440px" height="310px" /> <SBYXZT class="mt-16px" width="440px" height="310px" />
</div> </div>
<div class=""> <div class="">
<QXSZ width="440px" height="230px" /> <QXSZ width="440px" height="200px" />
<SZJCSJ class="mt-11px" width="440px" height="230px" /> <SZJCSJ class="mt-11px" width="440px" height="245px" />
<TRJCSJ class="mt-11px" width="440px" height="230px" /> <TRJCSJ class="mt-11px" width="440px" height="245px" />
</div> </div>
</div> </div>
</div> </div>