function culturalTourism() {
// 文化旅游
$('.cumulat').removeClass('click');
$('.thisMonth').addClass('click');
var shbzTableHtml = `
`
$(".wsylTable").empty().html(shbzTableHtml)
var chartDom = document.getElementById('whlyEchar');
var myChart = echarts.init(chartDom);
var alldata = [[4256415, 225424], [31762696, 1724264]];
var option;
var data = alldata[0]
option = {
grid: {
// 网格线配置
show: true,
lineStyle: {
color: ["#e9e9e9"],
width: 1,
type: "solid",
},
left: 100
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
},
backgroundColor: "rgb(0 0 0 / 40%)",
borderColor: 'none',
formatter: function (params) {
let total = params[0].value + params[1].value;
var html = "";
html = `
`+ params[0].axisValue + `:
`+ total.toLocaleString() + `人次
` + params[0].seriesName + `:
`+ params[0].value.toLocaleString() + `人次
` + params[1].seriesName + `:
`+ params[1].value.toLocaleString() + `人次
`
return html;
},
confine: true
},
xAxis: {
type: 'category',
data: ['接待海内外游客', '过夜游客'],
axisLabel: {
show: true,
textStyle: {
color: '#333', //更改坐标轴文字颜色
fontSize: 14 //更改坐标轴文字大小
}
},
isTick: {
show: true //坐标轴刻度线
},
axisLine: { //轴线
show: true
},
splitLine: { //网格线
show: true
},
},
yAxis: {
type: 'value',
min: 0,
max: 5000000,
interval: 1000000,
axisLabel: {
formatter: '{value}人次'
},
axisTick: {
show: true //坐标轴刻度线
},
axisLine: { //轴线
show: true
},
splitLine: { //网格线
show: true
}
},
series: [
{
name: '海外游客',
barWidth: 100,
data: [0, 0],
type: 'bar',
itemStyle: {
color: '#A7D0FD'
},
},
//4256415 225424 322450 31012
//31762696 1724264 2370899 286838
{
name: '海内游客',
barWidth: 100,
data: data,
type: 'bar',
barGap: '-100%',//移动第二个柱子的位置实现重叠
z: '-1',//改变这根柱子的层级使这根柱子在下面,
itemStyle: {
color: '#509EF3'
}
}
]
};
option && myChart.setOption(option);
// 文化旅游
$('.thisMonth').click(function () {
$('.cumulat').removeClass('click');
$('.thisMonth').addClass('click');
var shbzTableHtml = `
`
$(".wsylTable").empty().html(shbzTableHtml)
var option;
var data = alldata[0]
option = {
grid: {
// 网格线配置
show: true,
lineStyle: {
color: ["#e9e9e9"],
width: 1,
type: "solid",
},
left: 100
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
},
backgroundColor: "rgb(0 0 0 / 40%)",
borderColor: 'none',
formatter: function (params) {
let total = params[0].value + params[1].value;
var html = "";
html = `
`+ params[0].axisValue + `:
`+ total.toLocaleString() + `人次
` + params[0].seriesName + `:
`+ params[0].value.toLocaleString() + `人次
` + params[1].seriesName + `:
`+ params[1].value.toLocaleString() + `人次
`
return html;
},
confine: true
},
xAxis: {
type: 'category',
data: ['接待海内外游客', '过夜游客'],
axisLabel: {
show: true,
textStyle: {
color: '#333', //更改坐标轴文字颜色
fontSize: 14 //更改坐标轴文字大小
}
},
isTick: {
show: true //坐标轴刻度线
},
axisLine: { //轴线
show: true
},
splitLine: { //网格线
show: true
},
},
yAxis: {
type: 'value',
min: 0,
max: 5000000,
interval: 1000000,
axisLabel: {
formatter: '{value}(人次)'
},
axisTick: {
show: true //坐标轴刻度线
},
axisLine: { //轴线
show: true
},
splitLine: { //网格线
show: true
}
},
series: [
{
name: '海外游客',
barWidth: 100,
data: [0, 0],
type: 'bar',
itemStyle: {
color: '#A7D0FD'
}
},
//4256415 225424 322450 31012
//31762696 1724264 2370899 286838
{
name: '海内游客',
barWidth: 100,
data: data,
type: 'bar',
barGap: '-100%',//移动第二个柱子的位置实现重叠
z: '-1',//改变这根柱子的层级使这根柱子在下面,
itemStyle: {
color: '#509EF3'
}
}
]
};
myChart.clear();
option && myChart.setOption(option);
})
$('.cumulat').click(function () {
$('.cumulat').addClass('click');
$('.thisMonth').removeClass('click');
var shbzTableHtml = `
`
$(".wsylTable").empty().html(shbzTableHtml)
var option;
var data = alldata[1]
option = {
grid: {
// 网格线配置
show: true,
lineStyle: {
color: ["#e9e9e9"],
width: 1,
type: "solid",
},
left: 110
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
},
backgroundColor: "rgb(0 0 0 / 40%)",
borderColor: 'none',
formatter: function (params) {
let total = params[0].value + params[1].value;
var html = "";
html = `
`+ params[0].axisValue + `:
`+ total.toLocaleString() + `人次
` + params[0].seriesName + `:
`+ params[0].value.toLocaleString() + `人次
` + params[1].seriesName + `:
`+ params[1].value.toLocaleString() + `人次
`
return html;
},
confine: true
},
xAxis: {
type: 'category',
data: ['接待海内外游客', '过夜游客'],
axisLabel: {
show: true,
textStyle: {
color: '#333', //更改坐标轴文字颜色
fontSize: 14 //更改坐标轴文字大小
}
},
isTick: {
show: true //坐标轴刻度线
},
axisLine: { //轴线
show: true
},
splitLine: { //网格线
show: true
},
},
yAxis: {
type: 'value',
min: 0,
max: 35000000,
interval: 10000000,
axisLabel: {
formatter: '{value}(人次)'
},
axisTick: {
show: true //坐标轴刻度线
},
axisLine: { //轴线
show: true
},
splitLine: { //网格线
show: true
}
},
series: [
{
name: '海外游客',
barWidth: 100,
data: [0, 0],
type: 'bar',
itemStyle: {
color: '#A7D0FD'
}
},
//4256415 225424 322450 31012
//31762696 1724264 2370899 286838
{
name: '海内游客',
barWidth: 100,
data: data,
type: 'bar',
barGap: '-100%',//移动第二个柱子的位置实现重叠
z: '-1',//改变这根柱子的层级使这根柱子在下面,
itemStyle: {
color: '#509EF3'
}
}
]
};
myChart.clear();
option && myChart.setOption(option);
})
}