|
|
@@ -5,7 +5,7 @@ let app = new Vue({
|
|
|
count: 0, //重点项目两线指标轮到哪个
|
|
|
list: [], //重点项目两线指标数组
|
|
|
countType: 0, //重点项目两线指标数组
|
|
|
- mapShow: false, // false为中国地图 true为山西地图
|
|
|
+ mapShow: true, // false为中国地图 true为山西地图
|
|
|
titleUrl: '',// 标题弹窗显示的内容
|
|
|
titleName: '', // 弹窗的名字显示
|
|
|
leftEcharts1: "",
|
|
|
@@ -39,6 +39,7 @@ let app = new Vue({
|
|
|
time1: "", // 4秒定时器
|
|
|
time2: "", // 针对投前产业布局分析的定时器
|
|
|
projectNum: 0, // 项目阶段分析指示器
|
|
|
+ commonUrl: '',//获取当前服务器地址
|
|
|
projecList: [ //项目阶段分析内容距离
|
|
|
[
|
|
|
{ name: '特别监管', value: '14', value2: '12.05' },
|
|
|
@@ -53,7 +54,7 @@ let app = new Vue({
|
|
|
[
|
|
|
{ name: '特别监管', value: '10', value2: '32.69' },
|
|
|
{ name: '备案', value: '14', value2: '18.46' },
|
|
|
- { name: '科研论证', distance: '490px' }
|
|
|
+ { name: '可研论证', distance: '490px' }
|
|
|
],
|
|
|
[
|
|
|
{ name: '特别监管', value: '15', value2: '28.53' },
|
|
|
@@ -73,7 +74,7 @@ let app = new Vue({
|
|
|
[
|
|
|
{ name: '特别监管', value: '2', value2: '0.10' },
|
|
|
{ name: '备案', value: '19', value2: '1.01' },
|
|
|
- { name: '科研论证', distance: '590px' }
|
|
|
+ { name: '可研论证', distance: '590px' }
|
|
|
],
|
|
|
[
|
|
|
{ name: '特别监管', value: '27', value2: '15.52' },
|
|
|
@@ -81,6 +82,9 @@ let app = new Vue({
|
|
|
{ name: '投资决策', distance: '710px' }
|
|
|
],
|
|
|
],
|
|
|
+ year: '', // 选择的年份
|
|
|
+ pollList: [], // 年份有哪些呢
|
|
|
+ pullShow: false, // 选择年份弹窗
|
|
|
storageRecordConfig: {
|
|
|
waitTime: "10000",
|
|
|
hoverPause: true,
|
|
|
@@ -491,11 +495,15 @@ let app = new Vue({
|
|
|
},
|
|
|
mounted () {
|
|
|
this.getUrlParams()
|
|
|
+ this.countYear()
|
|
|
},
|
|
|
methods: {
|
|
|
// 获取地址栏参数
|
|
|
getUrlParams (id) {
|
|
|
let url = window.location.href
|
|
|
+ this.commonUrl = window.location.href.split('/')
|
|
|
+ this.commonUrl.pop()
|
|
|
+ this.commonUrl = this.commonUrl.join('/')
|
|
|
// 通过 ? 分割获取后面的参数字符串
|
|
|
let urlStr = url.split('?')[1]
|
|
|
if (!urlStr) {
|
|
|
@@ -519,6 +527,18 @@ let app = new Vue({
|
|
|
this.accountId = obj.accountid
|
|
|
this.comeIn()
|
|
|
},
|
|
|
+ // 计算展示的年份
|
|
|
+ countYear () {
|
|
|
+ this.year = new Date().getFullYear()
|
|
|
+ for (i = 2022; true; i++) {
|
|
|
+ if (i == this.year + 3) {
|
|
|
+ this.pollList.push(i)
|
|
|
+ return
|
|
|
+ } else {
|
|
|
+ this.pollList.push(i)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
comeIn () {
|
|
|
let that = this
|
|
|
this.time4s();
|
|
|
@@ -2344,6 +2364,7 @@ let app = new Vue({
|
|
|
fontWeight: "normal", // 文字字体的粗细（'normal'，无样式；'bold'，加粗；'bolder'，加粗的基础上再加粗；'lighter'，变细；数字定义粗细也可以，取值范围100至700）
|
|
|
fontSize: "28", // 文字字体大小
|
|
|
},
|
|
|
+ confine: true
|
|
|
},
|
|
|
legend: {
|
|
|
top: "center",
|
|
|
@@ -2543,8 +2564,10 @@ let app = new Vue({
|
|
|
pointer: {
|
|
|
show: true,
|
|
|
length: "100%",
|
|
|
- radius: "20%",
|
|
|
- width: 3, //指针粗细
|
|
|
+ // radius: "20%",
|
|
|
+ width: 80, //指针粗细
|
|
|
+ // icon: 'path://M2090.36389,615.30999 L2090.36389,615.30999 C2091.48372,615.30999 2092.40383,616.194028 2092.44859,617.312956 L2096.90698,728.755929 C2097.05155,732.369577 2094.2393,735.416212 2090.62566,735.56078 C2090.53845,735.564269 2090.45117,735.566014 2090.36389,735.566014 L2090.36389,735.566014 C2086.74736,735.566014 2083.81557,732.63423 2083.81557,729.017692 C2083.81557,728.930412 2083.81732,728.84314 2083.82081,728.755929 L2088.2792,617.312956 C2088.32396,616.194028 2089.24407,615.30999 2090.36389,615.30999 Z',
|
|
|
+ icon: 'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'
|
|
|
},
|
|
|
animationDuration: 4000,
|
|
|
},
|
|
|
@@ -2554,6 +2577,7 @@ let app = new Vue({
|
|
|
radius: "75%",
|
|
|
splitNumber: 10,
|
|
|
axisLine: {
|
|
|
+ show: true,
|
|
|
lineStyle: {
|
|
|
color: [
|
|
|
[
|
|
|
@@ -2592,30 +2616,50 @@ let app = new Vue({
|
|
|
},
|
|
|
},
|
|
|
{
|
|
|
- name: "外部刻度",
|
|
|
- type: "gauge",
|
|
|
- // center: ['20%', '50%'],
|
|
|
- radius: "90%",
|
|
|
- min: 0, //最小刻度
|
|
|
- max: 100, //最大刻度
|
|
|
+ name: '',
|
|
|
+ type: 'gauge',
|
|
|
splitNumber: 5, //刻度数量
|
|
|
- startAngle: 225,
|
|
|
- endAngle: -45,
|
|
|
+ min: 0,
|
|
|
+ max: 100,
|
|
|
+ radius: "90%",
|
|
|
+ zlevel: 1,
|
|
|
axisLine: {
|
|
|
show: true,
|
|
|
lineStyle: {
|
|
|
- width: 1,
|
|
|
- color: [[1, "rgba(0,0,0,0)"]],
|
|
|
+ width: 0,
|
|
|
+ shadowBlur: 0,
|
|
|
+ color: [
|
|
|
+ [0.2, '#23AFAF'],
|
|
|
+ [0.4, '#2270DA'],
|
|
|
+ [0.6, '#E99D02'],
|
|
|
+ [1, '#F45656']
|
|
|
+ ],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ axisTick: {
|
|
|
+ show: true,
|
|
|
+ lineStyle: {
|
|
|
+ color: 'auto',
|
|
|
+ width: 2
|
|
|
},
|
|
|
- }, //仪表盘轴线
|
|
|
+ length: 10,
|
|
|
+ splitNumber: 5
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ show: true,
|
|
|
+ length: -12,
|
|
|
+ lineStyle: {
|
|
|
+ color: 'auto',
|
|
|
+ width: 2
|
|
|
+ }
|
|
|
+ },
|
|
|
axisLabel: {
|
|
|
- show: false,
|
|
|
+ show: true,
|
|
|
color: "#ffffff",
|
|
|
- fontSize: 28,
|
|
|
+ fontSize: 20,
|
|
|
fontFamily: "SourceHanSansSC-Regular",
|
|
|
- fontWeight: "bold",
|
|
|
// position: "top",
|
|
|
- distance: -45,
|
|
|
+ distance: -30,
|
|
|
formatter: function (v) {
|
|
|
switch (v + "") {
|
|
|
case "0":
|
|
|
@@ -2642,26 +2686,24 @@ let app = new Vue({
|
|
|
return "100";
|
|
|
}
|
|
|
},
|
|
|
- }, //刻度标签。
|
|
|
- axisTick: {
|
|
|
- show: true,
|
|
|
- splitNumber: 10,
|
|
|
- lineStyle: {
|
|
|
- color: "#3798D7", //用颜色渐变函数不起作用
|
|
|
- width: 1,
|
|
|
- },
|
|
|
- length: -6,
|
|
|
- }, //刻度样式
|
|
|
- splitLine: {
|
|
|
+ },
|
|
|
+ pointer: { //仪表盘指针
|
|
|
+ show: 0,
|
|
|
+ length: '0%',
|
|
|
+ width: 1
|
|
|
+ },
|
|
|
+ anchor: {
|
|
|
show: true,
|
|
|
- length: -12,
|
|
|
- lineStyle: {
|
|
|
- color: "#3798D7", //用颜色渐变函数不起作用
|
|
|
- },
|
|
|
- }, //分隔线样式
|
|
|
+ showAbove: true,
|
|
|
+ size: 30,
|
|
|
+ itemStyle: {
|
|
|
+ color: '#EAEBF1',
|
|
|
+ }
|
|
|
+ },
|
|
|
detail: {
|
|
|
- show: false,
|
|
|
+ show: false
|
|
|
},
|
|
|
+ data: []
|
|
|
},
|
|
|
{
|
|
|
//指针上的圆
|
|
|
@@ -2764,11 +2806,11 @@ let app = new Vue({
|
|
|
grid: {
|
|
|
top: "0%",
|
|
|
right: "5%",
|
|
|
- left: "15%",
|
|
|
+ left: "17%",
|
|
|
bottom: "-10%",
|
|
|
},
|
|
|
yAxis: {
|
|
|
- data: ["备案", "特别监管"],
|
|
|
+ data: ["备案类", "特别监管类"],
|
|
|
splitLine: {
|
|
|
show: false,
|
|
|
lineStyle: {
|
|
|
@@ -2784,9 +2826,9 @@ let app = new Vue({
|
|
|
formatter: "{value}",
|
|
|
textStyle: {
|
|
|
color: function (data) {
|
|
|
- if (data == "特别监管") {
|
|
|
+ if (data == "特别监管类") {
|
|
|
return "#40A9FF";
|
|
|
- } else if (data == "备案") {
|
|
|
+ } else if (data == "备案类") {
|
|
|
return "#5BDCC8";
|
|
|
}
|
|
|
},
|
|
|
@@ -2825,7 +2867,7 @@ let app = new Vue({
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
- name: "特别监管",
|
|
|
+ name: "特别监管类",
|
|
|
type: "scatter",
|
|
|
symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
|
|
|
symbolSize: function (data) {
|
|
|
@@ -2848,7 +2890,7 @@ let app = new Vue({
|
|
|
// data: left13[0]
|
|
|
},
|
|
|
{
|
|
|
- name: "备案",
|
|
|
+ name: "备案类",
|
|
|
type: "scatter",
|
|
|
symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
|
|
|
symbolSize: function (data) {
|
|
|
@@ -2885,7 +2927,7 @@ let app = new Vue({
|
|
|
this.leftEcharts8 = echarts.init(this.$refs["leftEcharts8"]);
|
|
|
let option = {
|
|
|
title: {
|
|
|
- text: "固定资产进度分布",
|
|
|
+ text: "股权类项目进度分布",
|
|
|
textStyle: {
|
|
|
color: "#fff",
|
|
|
fontSize: 28,
|
|
|
@@ -2994,7 +3036,7 @@ let app = new Vue({
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
- name: "特别监管",
|
|
|
+ name: "特别监管类",
|
|
|
type: "scatter",
|
|
|
symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
|
|
|
symbolSize: function (data) {
|
|
|
@@ -3017,7 +3059,7 @@ let app = new Vue({
|
|
|
// data: left13[0]
|
|
|
},
|
|
|
{
|
|
|
- name: "备案",
|
|
|
+ name: "备案类",
|
|
|
type: "scatter",
|
|
|
symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
|
|
|
symbolSize: function (data) {
|
|
|
@@ -3222,10 +3264,8 @@ let app = new Vue({
|
|
|
name: params.name,
|
|
|
seriesName: "series\u00001",
|
|
|
});
|
|
|
- let a = window.location.href.split('/')
|
|
|
- a.pop()
|
|
|
if (params.value) {
|
|
|
- return `<div class="bgTooltip" style="background: url('${a.join('/')}/img/shanxi/${params.dataIndex}.png') no-repeat center center;background-size: 100% 100%;font-size:36px">
|
|
|
+ return `<div class="bgTooltip" style="background: url('${that.commonUrl}/img/shanxi/${params.dataIndex}.png') no-repeat center center;background-size: 100% 100%;font-size:36px">
|
|
|
<div class="flex items-center">
|
|
|
<img src="./img/yellowArrow.png" style="width: 12px;height: 22px;margin-right:10px" alt=""><span class="fb">${params.name}</span>
|
|
|
</div>
|
|
|
@@ -3570,15 +3610,15 @@ let app = new Vue({
|
|
|
type: "radial",
|
|
|
x: 0.5,
|
|
|
y: 0.5,
|
|
|
- r: 0.8,
|
|
|
+ r: 1,
|
|
|
colorStops: [
|
|
|
{
|
|
|
offset: 0,
|
|
|
- color: "#468ff8", // 0% 处的颜色
|
|
|
+ color: "#468ff850", // 0% 处的颜色
|
|
|
},
|
|
|
{
|
|
|
offset: 1,
|
|
|
- color: "#0a2c6d", // 100% 处的颜色
|
|
|
+ color: "#0a2c6d50", // 100% 处的颜色
|
|
|
},
|
|
|
],
|
|
|
globalCoord: false, // 缺省为 false
|
|
|
@@ -3587,7 +3627,7 @@ let app = new Vue({
|
|
|
shadowColor: "#468ff8",
|
|
|
shadowOffsetX: -2,
|
|
|
shadowOffsetY: 2,
|
|
|
- shadowBlur: 20,
|
|
|
+ shadowBlur: 10,
|
|
|
},
|
|
|
emphasis: {
|
|
|
areaColor: {
|
|
|
@@ -3691,18 +3731,6 @@ let app = new Vue({
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
- // {
|
|
|
- // name: "南海诸岛",
|
|
|
- // itemStyle: {
|
|
|
- // // 隐藏地图
|
|
|
- // normal: {
|
|
|
- // opacity: 0, // 为 0 时不绘制该图形
|
|
|
- // },
|
|
|
- // },
|
|
|
- // label: {
|
|
|
- // show: false, // 隐藏文字
|
|
|
- // },
|
|
|
- // },
|
|
|
],
|
|
|
},
|
|
|
tooltip: {
|
|
|
@@ -3799,7 +3827,7 @@ let app = new Vue({
|
|
|
data: [
|
|
|
{
|
|
|
name: "山西",
|
|
|
- value: [112.43, 37.73, 5303, 80],
|
|
|
+ value: [112.43, 37.73, 53003, 80],
|
|
|
},
|
|
|
],
|
|
|
symbolSize: function (val) {
|
|
|
@@ -3909,6 +3937,7 @@ let app = new Vue({
|
|
|
tooltip: {
|
|
|
show: true,
|
|
|
trigger: "axis",
|
|
|
+ // showContent
|
|
|
formatter: (data) => {
|
|
|
return `${data[0].name
|
|
|
}<br /><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[0].color
|
|
|
@@ -3921,7 +3950,10 @@ let app = new Vue({
|
|
|
},
|
|
|
axisPointer: {
|
|
|
// 坐标轴指示器，坐标轴触发有效
|
|
|
- type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
|
|
+ type: "line", // 默认为直线，可选为：'line' | 'shadow'
|
|
|
+ label: {
|
|
|
+ margin: 100,
|
|
|
+ }
|
|
|
},
|
|
|
backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
|
|
|
borderColor: "rgba(50,50,50,0.7)",
|
|
|
@@ -4242,15 +4274,15 @@ let app = new Vue({
|
|
|
value: 12,
|
|
|
radio: 0.13
|
|
|
}, {
|
|
|
- name: '公共基础产业',
|
|
|
+ name: '战略新兴产业',
|
|
|
value: 52,
|
|
|
radio: 0.01
|
|
|
}, {
|
|
|
- name: '战略性新兴产业',
|
|
|
+ name: '特色优势产业',
|
|
|
value: 15,
|
|
|
radio: 3.9
|
|
|
}, {
|
|
|
- name: '特色优势产业',
|
|
|
+ name: '公共基础产业',
|
|
|
value: 56,
|
|
|
radio: 10.5
|
|
|
}];
|
|
|
@@ -4295,7 +4327,7 @@ let app = new Vue({
|
|
|
type: 'pie',
|
|
|
clockWise: false,
|
|
|
radius: [170, 160],
|
|
|
- center: [260, 250],
|
|
|
+ center: [340, 250],
|
|
|
hoverAnimation: false,
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
@@ -4346,8 +4378,8 @@ let app = new Vue({
|
|
|
legend: {
|
|
|
icon: "circle",
|
|
|
orient: 'vertical',
|
|
|
- data: ['传统产业', '公共基础产业', '战略性新兴产业', '特色优势产业'],
|
|
|
- right: 0,
|
|
|
+ data: ['传统产业', '战略新兴产业', '特色优势产业', '公共基础产业'],
|
|
|
+ left: '5%',
|
|
|
bottom: 0,
|
|
|
align: 'left',
|
|
|
textStyle: {
|
|
|
@@ -4363,7 +4395,7 @@ let app = new Vue({
|
|
|
graphic: [{
|
|
|
type: 'image',
|
|
|
id: 'background',
|
|
|
- left: 130,
|
|
|
+ left: 210,
|
|
|
top: "center",
|
|
|
zlevel: 0,
|
|
|
silent: true,
|
|
|
@@ -4421,7 +4453,6 @@ let app = new Vue({
|
|
|
that.leftEcharts12.setOption(option);
|
|
|
},
|
|
|
leftEcharts17Fun () {
|
|
|
- console.log('就没走了么？？')
|
|
|
let that = this;
|
|
|
this.leftEcharts17 = echarts.init(this.$refs["leftEcharts17"]);
|
|
|
var seriesOption = [
|
|
|
@@ -4432,7 +4463,7 @@ let app = new Vue({
|
|
|
show: false
|
|
|
},
|
|
|
data: [left2[0]],
|
|
|
- center: [270, 260],
|
|
|
+ center: [350, 260],
|
|
|
backgroundStyle: {
|
|
|
color: {
|
|
|
type: "radial",
|
|
|
@@ -4553,14 +4584,20 @@ let app = new Vue({
|
|
|
let that = this;
|
|
|
this.leftEcharts13 = echarts.init(this.$refs["leftEcharts13"]);
|
|
|
var totalData = [{
|
|
|
- name: '新建',
|
|
|
+ name: '特别监管类',
|
|
|
value: 12,
|
|
|
radio: 0.13
|
|
|
}, {
|
|
|
- name: '续建',
|
|
|
+ name: '备案类投资完成金额',
|
|
|
value: 52,
|
|
|
radio: 0.01
|
|
|
- }];
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '项目数量',
|
|
|
+ value: 52,
|
|
|
+ radio: 0.01
|
|
|
+ }
|
|
|
+ ];
|
|
|
|
|
|
var data = [];
|
|
|
for (var i = 0; i < totalData.length; i++) {
|
|
|
@@ -4668,7 +4705,7 @@ let app = new Vue({
|
|
|
legend: {
|
|
|
icon: "circle",
|
|
|
orient: 'vertical',
|
|
|
- data: ['新建', '续建'],
|
|
|
+ data: ['特别监管类', '备案类投资完成金额', '项目数量'],
|
|
|
right: 0,
|
|
|
bottom: 0,
|
|
|
align: 'left',
|
|
|
@@ -5359,5 +5396,17 @@ let app = new Vue({
|
|
|
})
|
|
|
that.myChartTip1.setOption(option);
|
|
|
},
|
|
|
+ chooseTime (value) {
|
|
|
+ let that = this
|
|
|
+ // this.backChina()
|
|
|
+ // this.year = value
|
|
|
+ // that.fling = false
|
|
|
+ // that.destroyCharts()
|
|
|
+ // that.closeTap()
|
|
|
+ this.pullShow = false
|
|
|
+ setTimeout(item => {
|
|
|
+ // that.comeIn()
|
|
|
+ })
|
|
|
+ },
|
|
|
},
|
|
|
});
|
zhbyyy
