1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227 |
- layui.use(['element', 'form', 'tree', 'util', 'laydate'], function () {
- var $ = layui.jquery,
- form = layui.form,
- laydate = layui.laydate,
- tree = layui.tree,
- layer = layui.layer,
- util = layui.util,
- element = layui.element,
- data1 = [
- {
- title: '地区生产总值',
- id: 1,
- children: [{
- title: '第一产业',
- id: 1000,
- type: 101,
- clickType: 1,
- color1: '#9BCE4A',
- color2: '#ffb43e'
- }, {
- title: '第二产业',
- id: 1001,
- type: 102,
- clickType: 1,
- color1: '#29B6F6',
- color2: '#5efff5'
- }, {
- title: '第三产业',
- id: 1002,
- type: 103,
- clickType: 1,
- color1: '#34D3EB',
- color2: '#9cdc7e'
- }]
- },
- {
- title: '规模以上工业增加值增速',
- id: 2,
- color1: '#9BCE4A',
- },
- {
- title: '建筑业总产值',
- id: 3,
- color1: '#29B6F6',
- },
- {
- title: '商品房建设与销售',
- id: 4,
- color1: '#34D3EB',
- },
- {
- title: '社会消费品零售总额总额',
- id: 5,
- color1: '#9BCE4A',
- },
- // {
- // title: '批发业销售额',
- // id: 5,
- // type: 201,
- // color1: '#9BCE4A'
- // },
- // {
- // title: '零售业销售额',
- // id: 6,
- // type: 202,
- // color1: '#29B6F6',
- // },
- // {
- // title: '住宿业销售额',
- // id: 7,
- // type: 203,
- // color1: '#34D3EB'
- // },
- // {
- // title: '餐饮业销售额',
- // id: 8,
- // type: 204,
- // color1: '#0090f4',
- // },
- {
- title: '地方财政收支',
- id: 8,
- children: [{
- title: '公共财政收入',
- id: 6000,
- type: 301,
- clickType: 3,
- color1: '#9BCE4A',
- color2: '#ffb43e'
- }, {
- title: ' 税收收入',
- id: 6001,
- type: 302,
- clickType: 3,
- color1: '#29B6F6',
- color2: '#5efff5'
- }, {
- title: '公共财政支出',
- id: 6002,
- type: 303,
- clickType: 3,
- color1: '#34D3EB',
- color2: '#9cdc7e'
- }]
- },
- // {
- // title: '金融机构存贷款',
- // id: 9,
- // children: [{
- // title: '金融机构人民币存款余额',
- // id: 7000,
- // clickType: 4,
- // type: 401,
- // color1: '#29B6F6',
- // color2: '#ffb43e'
- // }, {
- // title: '金融机构人民币贷款余额',
- // id: 7001,
- // clickType: 4,
- // type: 402,
- // color1: '#34D3EB',
- // color2: '#5efff5'
- // }]
- // }
- ];
- // if (isMobileUserAgent()){
- // window.location = 'enterStatisMain_mobile.html'
- // }
- laydate.render({
- elem: '#test6',
- range: ['#test-startDate', '#test-endDate']
- });
- element.on('tab(test1)', function (e) {
- var cur = this.getAttribute('lay-id');
- var myChart = echarts.init(document.getElementById(cur));
- var option = myChart.getOption();
- myChart.clear();
- myChart.setOption(option, true);
- });
- document.getElementById("mainCenter").removeAttribute("_echarts_instance_");
- var myChart = echarts.init(document.getElementById('mainCenter'));
- getAllIndustry(data1, myChart);
- tree.render({
- elem: '#test13',
- data: data1,
- showLine: false, //是否开启连接线
- click: function (obj) {
- myChart.innerHTML = "";
- $('.tableMain').empty();
- $('.tableTit').empty();
- if (obj.data.title == '地区生产总值') {
- getAllIndustry(data1, myChart)
- }
- if (obj.data.title == '规模以上工业增加值增速') {
- getAllScale(obj, myChart)
- }
- if (obj.data.title == '建筑业总产值') {
- getAllConstruction(obj, myChart)
- }
- if (obj.data.title == '商品房建设与销售') {
- getAllMarket(obj, myChart)
- }
- if (obj.data.title == '社会消费品零售总额总额') {
- getinlandTradeL(obj, myChart);
- }
- // if (obj.data.title == '批发业销售额') {
- // getinlandTrade(obj, myChart);
- // }
- // if (obj.data.title == '零售业销售额') {
- // getinlandTrade(obj, myChart);
- // }
- // if (obj.data.title == '住宿业销售额') {
- // getinlandTrade(obj, myChart);
- // }
- // if (obj.data.title == '餐饮业销售额') {
- // getinlandTrade(obj, myChart);
- // }
- if (obj.data.title == '地方财政收支') {
- getAllFinancial(data1, myChart)
- }
- if (obj.data.title == '金融机构存贷款') {
- getAllFinan(data1, myChart)
- }
- if (obj.data.clickType == 1) {
- getIndustryByType(obj, myChart);
- }
- if (obj.data.clickType == 2) {
- getinlandTrade(obj, myChart);
- }
- if (obj.data.clickType == 3) {
- getFinancial(obj, myChart);
- }
- if (obj.data.clickType == 4) {
- getBank(obj, myChart)
- }
- }
- });
- // if (isMobileUserAgent()){
- // window.location = 'xq_model.html'
- // }
- });
- function isMobileUserAgent() {
- return /iphone|ipod|android.*mobile|windows.*phone|blackberry.*mobile/i.test(
- window.navigator.userAgent.toLowerCase("")
- );
- }
- function getAllMarket(obj, myChart) {
- var str, listdataa;
- getData('./json/realtyMarket.json').then(data => {
- var list = data.market;
- var array = [];
- var xdata = [];
- for (var i = 0; i < list.length; i++) {
- var subData = list[i].totalNum;
- if (subData.length == 3) {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- array.push(...subData);
- } else {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- xdata.push(list[i].date + '年1-4季度');
- array.push(...subData);
- }
- }
- var chat = [{
- 'name': obj.data.title,
- 'data': array,
- 'color1': obj.data.color1,
- 'color2': obj.data.color2,
- 'xdata': xdata
- }]
- option = getLine(chat, '万平方米');
- myChart.setOption(option, true);
- var tabletit = list[0].name;
- str = '<th>' + tabletit + '</th>';
- listdataa += '<tr>'
- listdataa += '<td>值</td>'
- for (var j = 0; j < array.length; j++) {
- listdataa += '<td>' + array[j] + '万平方米' + '</td>';
- }
- listdataa += '</tr>'
- for (var j = 0; j < list.length; j++) {
- for (var k = 0; k < list[j].totalNum.length; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + list[j].date + '第一至' + a + '季度</th>'
- }
- }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getinlandTradeL(obj, myChart) {
- var str, listdataa;
- getData('./json/inlandTrade.json').then(data => {
- var list = data.trade;
- var array = [];
- var xdata = [];
- for (var i = 0; i < list.length; i++) {
- var subData = list[i].totalNum;
- if (subData.length == 3) {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- array.push(...subData);
- } else {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- xdata.push(list[i].date + '年1-4季度');
- array.push(...subData);
- }
- }
- var chat = [{
- 'name': obj.data.title,
- 'data': array,
- 'color1': obj.data.color1,
- 'color2': obj.data.color2,
- 'xdata': xdata
- }]
- option = getLine(chat, '万元');
- myChart.setOption(option, true);
- var tabletit = list[0].name;
- str = '<th>' + tabletit + '</th>';
- listdataa += '<tr>'
- listdataa += '<td>值</td>'
- for (var j = 0; j < array.length; j++) {
- listdataa += '<td>' + array[j] + '万元' + '</td>';
- }
- listdataa += '</tr>'
- for (var j = 0; j < list.length; j++) {
- for (var k = 0; k < list[j].totalNum.length; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + list[j].date + '第一至' + a + '季度</th>'
- }
- }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getAllConstruction(obj, myChart) {
- var str, listdataa;
- getData('./json/construction.json').then(data => {
- var list = data.construction;
- var array = [];
- var xdata = [];
- for (var i = 0; i < list.length; i++) {
- var subData = list[i].totalNum;
- if (subData.length == 3) {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- array.push(...subData);
- } else {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- xdata.push(list[i].date + '年1-4季度');
- array.push(...subData);
- }
- }
- var chat = [{
- 'name': obj.data.title,
- 'data': array,
- 'color1': obj.data.color1,
- 'color2': obj.data.color2,
- 'xdata': xdata
- }]
- option = getLine(chat, '万元');
- myChart.setOption(option, true);
- var tabletit = list[0].name;
- str = '<th>' + tabletit + '</th>';
- listdataa += '<tr>'
- listdataa += '<td>值</td>'
- for (var j = 0; j < array.length; j++) {
- listdataa += '<td>' + array[j] + '万元' + '</td>';
- }
- listdataa += '</tr>'
- for (var j = 0; j < list.length; j++) {
- for (var k = 0; k < list[j].totalNum.length; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + list[j].date + '第一至' + a + '季度</th>'
- }
- }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getAllScale(obj, myChart) {
- var str, listdataa;
- getData('./json/scale.json').then(data => {
- var list = data.scale;
- var array = [];
- var xdata = [];
- for (var i = 0; i < list.length; i++) {
- var subData = list[i].growth;
- if (subData.length == 3) {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- array.push(...subData);
- } else {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- xdata.push(list[i].date + '年1-4季度');
- array.push(...subData);
- }
- }
- var chat = [{
- 'name': obj.title,
- 'data': array,
- 'color1': obj.color1,
- 'color2': obj.color2,
- 'xdata': xdata
- }]
- option = getLinel(chat, '%');
- myChart.setOption(option, true);
- var tabletit = list[0].name;
- str = '<th>' + tabletit + '</th>';
- listdataa += '<tr>'
- listdataa += '<td>增速</td>'
- for (var j = 0; j < array.length; j++) {
- listdataa += '<td>' + array[j] + '%' + '</td>';
- }
- listdataa += '</tr>'
- for (var j = 0; j < list.length; j++) {
- for (var k = 0; k < list[j].growth.length; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + list[j].date + '第一至' + a + '季度</th>'
- }
- }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getAllIndustry(data1, myChart) {
- var str = '';
- var listdataa = '';
- getData('./json/jdp.json').then(data => {
- var children = data1[0].children;
- var array = [];
- if (children) {
- for (var i = 0; i < children.length; i++) {
- array.push(getIndustryByTypeAll(data.GDP, children[i]));
- }
- }
- option = getLine(array, '万元');
- // myChart.setOption(option, true);
- var tabletit = data.GDP[0].name;
- str = '<th>' + tabletit + '</th>';
- for (var j = 0; j < array.length; j++) {
- listdataa += '<tr>'
- listdataa += '<td>' + array[j].name + '</td>'
- for (var k = 0; k < array[j].data.length; k++) {
- listdataa += '<td>' + array[j].data[k] + '万元' + '</td>';
- }
- listdataa += '</tr>'
- }
- for (var j = 0; j < data.GDP.length; j++) {
- for (var k = 0; k < data.GDP[j].totalNum.length; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + data.GDP[j].date + '第一至' + a + '季度</th>'
- }
- }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getAllwholeScale(data1, myChart) {
- var str = '';
- var listdataa = '';
- getData('./json/inlandTrade.json').then(data => {
- var children = data1[4].children;
- var array = [];
- for (var i = 0; i < children.length; i++) {
- array.push(getScaleByTypeAll(data.trade, children[i]));
- }
- option = getLine(array, '万元');
- myChart.setOption(option, true);
- var tabletit = data.trade[0].name;
- str = '<th>' + tabletit + '</th>';
- for (var j = 0; j < array.length; j++) {
- listdataa += '<tr>'
- listdataa += '<td>' + array[j].name + '</td>'
- for (var k = 0; k < array[j].data.length; k++) {
- listdataa += '<td>' + array[j].data[k] + '万元' + '</td>';
- }
- listdataa += '</tr>'
- }
- for (var j = 0; j < data.trade.length; j++) {
- for (var k = 0; k < data.trade[j].totalNum.length; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + data.trade[j].date + '第一至' + a + '季度</th>'
- }
- }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getAllFinancial(data1, myChart) {
- var str, listdataa;
- getData('./json/financial.json').then(data => {
- var children = data1[8].children;
- var array = [];
- for (var i = 0; i < children.length; i++) {
- array.push(getScaleByTypeAll(data.financial, children[i]));
- }
- option = getLine(array, '万元');
- myChart.setOption(option, true);
- var tabletit = data.financial[0].name;
- str = '<th>' + tabletit + '</th>';
- for (var j = 0; j < array.length; j++) {
- listdataa += '<tr>'
- listdataa += '<td>' + array[j].name + '</td>'
- for (var k = 0; k < array[j].data.length; k++) {
- listdataa += '<td>' + array[j].data[k] + '万元' + '</td>';
- }
- listdataa += '</tr>'
- }
- for (var j = 0; j < data.financial.length; j++) {
- for (var k = 0; k < data.financial[j].totalNum.length; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + data.financial[j].date + '第一至' + a + '季度</th>'
- }
- }
- // for (var j = 0; j < data.financial.length; j++) {
- // if (data.financial[j].subData[0].data.firstThridQuarter) {
- // for (var k = 0; k < 4; k++) {
- // let a = NoToChinese(Number(k) + 1)
- // str += '<th>' + data.financial[j].date + '第一至' + a + '季度</th>'
- // }
- // } else {
- // str += '<th>' + data.financial[j].date + '第一至一季度</th>'
- // }
- // }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getAllFinan(data1, myChart) {
- var str, listdataa;
- getData('./json/bank.json').then(data => {
- var children = data1[9].children;
- var array = [];
- for (var i = 0; i < children.length; i++) {
- array.push(getScaleByTypeAll(data.finance, children[i]));
- }
- option = getLine(array, '亿元');
- myChart.setOption(option, true);
- var tabletit = data.finance[0].name;
- str = '<th>' + tabletit + '</th>';
- for (var j = 0; j < array.length; j++) {
- listdataa += '<tr>'
- listdataa += '<td>' + array[j].name + '</td>'
- for (var k = 0; k < array[j].data.length; k++) {
- listdataa += '<td>' + array[j].data[k] + '亿元' + '</td>';
- }
- listdataa += '</tr>'
- }
- for (var j = 0; j < data.finance.length; j++) {
- var len = Object.keys(data.finance[j].subData[0].data).length;
- for (var k = 0; k < len; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + data.finance[j].date + '第一至' + a + '季度</th>'
- }
- }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getinlandTrade(obj, myChart) {
- var str, listdataa;
- getData('./json/inlandTrade.json').then(data => {
- var list = data.trade;
- var array = [];
- var xdata = [];
- var xname = '';
- for (var i = 0; i < list.length; i++) {
- var subData = list[i].subData;
- if (subData[2].data.firstFourQuarter) {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- xdata.push(list[i].date + '年1-4季度');
- } else {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- }
- for (var j = 0; j < subData.length; j++) {
- if (obj.data.type == subData[j].type) {
- xname = subData[j].subName
- var ndata = subData[j].data;
- array.push(ndata.firstQuarter.totalQuarter ?
- ndata.firstQuarter.totalQuarter : 0);
- if (ndata.firstSecondQuarter) {
- array.push(ndata.firstSecondQuarter.totalQuarter ?
- ndata.firstSecondQuarter.totalQuarter : 0);
- }
- if (ndata.firstThridQuarter) {
- array.push(ndata.firstThridQuarter.totalQuarter ?
- ndata.firstThridQuarter.totalQuarter : 0);
- }
- if (ndata.firstFourQuarter) {
- array.push(ndata.firstFourQuarter.totalQuarter ?
- ndata.firstFourQuarter.totalQuarter : 0);
- }
- }
- }
- }
- var chat = [{
- 'name': obj.data.title,
- 'data': array,
- 'color1': obj.data.color1,
- 'color2': obj.data.color2,
- 'xdata': xdata
- }]
- option = getLine(chat, '万元');
- myChart.setOption(option, true);
- var tabletit = xname;
- str = '<th>' + tabletit + '</th>';
- listdataa += '<tr>'
- listdataa += '<td>值</td>'
- for (var j = 0; j < array.length; j++) {
- listdataa += '<td>' + array[j] + '万元' + '</td>';
- }
- listdataa += '</tr>'
- for (var j = 0; j < list.length; j++) {
- for (var k = 0; k < list[j].totalNum.length; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + list[j].date + '第一至' + a + '季度</th>'
- }
- }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getFinancial(obj, myChart) {
- var str, listdataa;
- getData('./json/financial.json').then(data => {
- var list = data.financial;
- var array = [];
- var xdata = [];
- var xname = '';
- for (var i = 0; i < list.length; i++) {
- var subData = list[i].subData;
- if (subData[2].data.firstFourQuarter) {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- xdata.push(list[i].date + '年1-4季度');
- } else {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- }
- for (var j = 0; j < subData.length; j++) {
- if (obj.data.type == subData[j].type) {
- xname = subData[j].subName
- var ndata = subData[j].data;
- array.push(ndata.firstQuarter.totalQuarter ?
- ndata.firstQuarter.totalQuarter : 0);
- if (ndata.firstSecondQuarter) {
- array.push(ndata.firstSecondQuarter.totalQuarter ?
- ndata.firstSecondQuarter.totalQuarter : 0);
- }
- if (ndata.firstThridQuarter) {
- array.push(ndata.firstThridQuarter.totalQuarter ?
- ndata.firstThridQuarter.totalQuarter : 0);
- }
- if (ndata.firstFourQuarter) {
- array.push(ndata.firstFourQuarter.totalQuarter ?
- ndata.firstFourQuarter.totalQuarter : 0);
- }
- }
- }
- }
- var chat = [{
- 'name': obj.data.title,
- 'data': array,
- 'color1': obj.data.color1,
- 'color2': obj.data.color2,
- 'xdata': xdata
- }]
- option = getLine(chat, '万元');
- myChart.setOption(option, true);
- var tabletit = xname;
- str = '<th>' + tabletit + '</th>';
- listdataa += '<tr>'
- listdataa += '<td>值</td>'
- for (var j = 0; j < array.length; j++) {
- listdataa += '<td>' + array[j] + '万元' + '</td>';
- }
- listdataa += '</tr>'
-
- for (var j = 0; j < list.length; j++) {
- if (list[j].subData[0].data.firstFourQuarter) {
- for (var k = 0; k < 4; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + list[j].date + '第一至' + a + '季度</th>'
- }
- } else {
- str += '<th>' + list[j].date + '第一至一季度</th>'
- str += '<th>' + list[j].date + '第一至二季度</th>'
- str += '<th>' + list[j].date + '第一至三季度</th>'
- }
- }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getBank(obj, myChart) {
- var str, listdataa;
- getData('./json/bank.json').then(data => {
- var list = data.finance;
- var array = [];
- var xdata = [];
- var xname = '';
- for (var i = 0; i < list.length; i++) {
- var subData = list[i].subData;
- if (subData[1].data.firstFourQuarter) {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- xdata.push(list[i].date + '年1-4季度');
- } else {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- }
- for (var j = 0; j < subData.length; j++) {
- if (obj.data.type == subData[j].type) {
- xname = subData[j].subName
- var ndata = subData[j].data;
- array.push(ndata.firstQuarter.totalQuarter ?
- ndata.firstQuarter.totalQuarter : 0);
- if (ndata.firstSecondQuarter) {
- array.push(ndata.firstSecondQuarter.totalQuarter ?
- ndata.firstSecondQuarter.totalQuarter : 0);
- }
- if (ndata.firstThridQuarter) {
- array.push(ndata.firstThridQuarter.totalQuarter ?
- ndata.firstThridQuarter.totalQuarter : 0);
- }
- if (ndata.firstFourQuarter) {
- array.push(ndata.firstFourQuarter.totalQuarter ?
- ndata.firstFourQuarter.totalQuarter : 0);
- }
- }
- }
- }
- var chat = [{
- 'name': obj.data.title,
- 'data': array,
- 'color1': obj.data.color1,
- 'color2': obj.data.color2,
- 'xdata': xdata
- }]
- option = getLine(chat, '亿元');
- myChart.setOption(option, true);
- var tabletit = xname;
- str = '<th>' + tabletit + '</th>';
- listdataa += '<tr>'
- listdataa += '<td>值</td>'
- for (var j = 0; j < array.length; j++) {
- listdataa += '<td>' + array[j] + '亿元' + '</td>';
- }
- listdataa += '</tr>'
- for (var j = 0; j < list.length; j++) {
- if (list[j].subData[0].data.firstSecondQuarter) {
- for (var k = 0; k < 4; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + list[j].date + '第一至' + a + '季度</th>'
- }
- } else {
- str += '<th>' + list[j].date + '第一至一季度</th>'
- }
- }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getIndustryByType(obj, myChart) {
- var str, listdataa;
- getData('./json/jdp.json').then(data => {
- var list = data.GDP;
- var array = [];
- var xdata = [];
- var xname = ''
- for (var i = 0; i < list.length; i++) {
- var subData = list[i].subData;
- if (subData[2].data.firstFourQuarter) {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- xdata.push(list[i].date + '年1-4季度');
- } else {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- }
- for (var j = 0; j < subData.length; j++) {
- if (obj.data.type == subData[j].type) {
- xname = subData[j].subName
- var ndata = subData[j].data;
- array.push(ndata.firstQuarter.totalQuarter ?
- ndata.firstQuarter.totalQuarter : 0);
- if (ndata.firstSecondQuarter) {
- array.push(ndata.firstSecondQuarter.totalQuarter ?
- ndata.firstSecondQuarter.totalQuarter : 0);
- }
- if (ndata.firstThridQuarter) {
- array.push(ndata.firstThridQuarter.totalQuarter ?
- ndata.firstThridQuarter.totalQuarter : 0);
- }
- if (ndata.firstFourQuarter) {
- array.push(ndata.firstFourQuarter.totalQuarter ?
- ndata.firstFourQuarter.totalQuarter : 0);
- }
- }
- }
- }
- var chat = [{
- 'name': obj.data.title,
- 'data': array,
- 'color1': obj.data.color1,
- 'color2': obj.data.color2,
- 'xdata': xdata
- }]
- option = getLine(chat, '万元');
- myChart.setOption(option, true);
- var tabletit = xname;
- str = '<th>' + tabletit + '</th>';
- listdataa += '<tr>'
- listdataa += '<td>值</td>'
- for (var j = 0; j < array.length; j++) {
- listdataa += '<td>' + array[j] + '万元' + '</td>';
- }
- listdataa += '</tr>'
- for (var j = 0; j < list.length; j++) {
- for (var k = 0; k < list[j].totalNum.length; k++) {
- let a = NoToChinese(Number(k) + 1)
- str += '<th>' + list[j].date + '第一至' + a + '季度</th>'
- }
- }
- $('.tableTit').append(str);
- $('.tableMain').append(listdataa);
- })
- }
- function getIndustryByTypeAll(list, obj) {
- var array = [];
- var xdata = [];
- for (var i = 0; i < list.length; i++) {
- var subData = list[i].subData;
- if (subData[2].data.firstFourQuarter) {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- xdata.push(list[i].date + '年1-4季度');
- } else {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- }
- for (var j = 0; j < subData.length; j++) {
- if (obj.type == subData[j].type) {
- var ndata = subData[j].data;
- array.push(ndata.firstQuarter.totalQuarter ?
- ndata.firstQuarter.totalQuarter : 0);
- if (ndata.firstSecondQuarter) {
- array.push(ndata.firstSecondQuarter.totalQuarter ?
- ndata.firstSecondQuarter.totalQuarter : 0);
- }
- if (ndata.firstThridQuarter) {
- array.push(ndata.firstThridQuarter.totalQuarter ?
- ndata.firstThridQuarter.totalQuarter : 0);
- }
- if (ndata.firstFourQuarter) {
- array.push(ndata.firstFourQuarter.totalQuarter ?
- ndata.firstFourQuarter.totalQuarter : 0);
- }
- }
- }
- }
- return chat = {
- 'name': obj.title,
- 'data': array,
- 'color1': obj.color1,
- 'color2': obj.color2,
- 'xdata': xdata
- }
- }
- function getScaleByTypeAll(list, obj) {
- var array = [];
- var xdata = [];
- for (var i = 0; i < list.length; i++) {
- var subData = list[i].subData;
- if (subData[1].data.firstFourQuarter) {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- xdata.push(list[i].date + '年1-4季度');
- } else {
- xdata.push(list[i].date + '年1季度');
- xdata.push(list[i].date + '年1-2季度');
- xdata.push(list[i].date + '年1-3季度');
- }
- for (var j = 0; j < subData.length; j++) {
- if (obj.type == subData[j].type) {
- var ndata = subData[j].data;
- array.push(ndata.firstQuarter.totalQuarter ?
- ndata.firstQuarter.totalQuarter : 0);
- if (ndata.firstSecondQuarter) {
- array.push(ndata.firstSecondQuarter.totalQuarter ?
- ndata.firstSecondQuarter.totalQuarter : 0);
- }
- if (ndata.firstThridQuarter) {
- array.push(ndata.firstThridQuarter.totalQuarter ?
- ndata.firstThridQuarter.totalQuarter : 0);
- }
- if (ndata.firstFourQuarter) {
- array.push(ndata.firstFourQuarter.totalQuarter ?
- ndata.firstFourQuarter.totalQuarter : 0);
- }
- }
- }
- }
- return chat = {
- 'name': obj.title,
- 'data': array,
- 'color1': obj.color1,
- 'color2': obj.color2,
- 'xdata': xdata
- }
- }
- var list = ''
- function getData(url) {
- return new Promise((resolve, reject) => {
- $.ajax({
- url: url,
- dataType: 'json',
- success: function (scenetree) {
- if (scenetree) {
- resolve(scenetree);
- }
- }
- });
- })
- }
- getData('./json/construction.json').then(data => {
- var myChartConstruction = echarts.init(document.getElementById('constructionmain'))
- var option = getBar(data.construction, '万元');
- myChartConstruction.setOption(option, true);
- })
- getData('./json/realtyMarket.json').then(data => {
- var myChartConstruction = echarts.init(document.getElementById('realtyMarketmain'))
- var option = getBar(data.market, '万平方米');
- myChartConstruction.setOption(option, true);
- })
- getData('./json/inlandTrade.json').then(data => {
- var myChartConstruction = echarts.init(document.getElementById('inlandTrademain'));
- myChartConstruction.clear();
- var option = getBar(data.trade, '万元');
- myChartConstruction.setOption(option, true);
- })
- getData('./json/financial.json').then(data => {
- var myChartConstructionFinancial = echarts.init(document.getElementById('publicIncomemain'))
- var getOption = getOtherBar(data.financial, '万元');
- var optionFinancial = getOption('公共财政收入');
- myChartConstructionFinancial.setOption(optionFinancial);
- $(".togglePic").click(function () {
- var newKey = $(this).html();
- var optionFinancial = getOption(newKey);
- myChartConstructionFinancial.clear();
- myChartConstructionFinancial.setOption(optionFinancial);
- })
- })
- getData('./json/bank.json').then(data => {
- var myChartConstructionBank = echarts.init(document.getElementById('bankmain'))
- var getOption = getOtherBar(data.finance, '亿元');
- var optionBank = getOption('金融机构人民币存款余额');
- myChartConstructionBank.setOption(optionBank);
- $(".togglePic2").click(function () {
- var newKey = $(this).html();
- var optionBank = getOption(newKey);
- myChartConstructionBank.clear();
- myChartConstructionBank.setOption(optionBank);
- })
- })
- function getBar(list, unit) {
- var dateNum = ['date'];
- var alloneBasis = [];
- var allData = ['季度'];
- for (var i = 0; i < list.length; i++) {
- for (var j = 1; j <= list[i].totalNum.length; j++) {
- var str = ' ';
- if (j == 1) {
- str = list[i].date + '年' + ' ' + '第1季度';
- dateNum.push(str);
- } else {
- str = list[i].date + '年' + ' ' + '第1~' + j + '季度';
- dateNum.push(str);
- }
- }
- var totalNumList = list[i].totalNum;
- for (var k = 0; k < totalNumList.length; k++) {
- allData.push(totalNumList[k]);
- }
- var alloneBasisList = list[i].alloneBasis;
- for (var n = 0; n < alloneBasisList.length; n++) {
- alloneBasis.push(alloneBasisList[n]);
- }
- };
- var sourceData = [dateNum, allData];
- return {
- legend: {
- textStyle:{
- fontSize: 30
- }
- },
- grid: {
- left: '2%',
- right: '10%',
- bottom: '-2%',
- width: 1000,
- containLabel: true
- },
- dataZoom:[//x轴滑动条
- {
- type: 'slider',
- show: true,
- xAxisIndex: [0],
- start: 0, //初始化时,滑动条宽度开始标度
- bottom: '7%',
- end: 45,
- height: 2,
- fillerColor:'#3E86FF',
- showDataShadow: false,//是否显示数据阴影 默认auto
- showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
- },
- {
- type:'inside',
- xAxisIndex:0,
- zoomOnMouseWheel:false, //滚轮是否触发缩放
- moveOnMouseMove:true, //鼠标滚轮触发滚动
- moveOnMouseWheel:true
- }
- ],
- tooltip: {
- trigger: 'item',
- formatter: function (params) {
- var htmlStr = '';
- var color = params.color; //图例颜色
- var seriesName = params.seriesName; //图例名称
- var xName = params.name; //x轴的名称
- var value = params.value; //y轴值
- var htmlStr = '<div style="margin-right: 5px; font-size: 19pt;">';
- htmlStr += seriesName + '<br/>';
- htmlStr +=
- '<span style="margin-right: 5px; font-size: 19pt; font-family: Consolas;display: inline-block; width: 10px; height: 10px; border-radius: 50%; background-color:' +
- color + ' ;"></span>';
- htmlStr += "<span style='min-height: 20pt; font-size: 17pt'>";
- htmlStr += xName;
- htmlStr += '</span>';
- htmlStr += "<span style='min-height: 20pt; font-size: 17pt; margin-left: 20px'>";
- if (!value.length) {
- htmlStr += value + '%';
- } else {
- htmlStr += value[params.seriesIndex + 1] + unit; //选择对应value的坐标
- }
- htmlStr += '</span>'
- htmlStr += '</div>';
- return htmlStr;
- }
- },
- dataset: {
- source: sourceData
- },
- xAxis: [{
- type: 'category',
- axisLabel: {
- formatter: '{value}',
- interval: 0,
- rotate: -40,
- fontSize: 40
- },
- },
- ],
- yAxis: [{
- gridIndex: 0,
- axisLabel: {
- formatter: '{value}' + unit,
- fontSize: 20
- }
- },
- {
- type: 'value',
- axisLabel: {
- formatter: '{value}%',
- fontSize: 30
- }
- }
- ],
- series: [{
- type: 'bar',
- seriesLayoutBy: 'row',
- itemStyle: {
- normal: {
- color: function (params) {
- // build a color map as your need.
- var colorList = [
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- ];
- return colorList[params.dataIndex]
- },
- }
- },
- },
- {
- name: '同比增减(%)',
- type: 'line',
- color: ['#91CC75'],
- yAxisIndex: 1,
- data: alloneBasis,
- symbolSize: 3, //一定要加这个字段才能显示
- itemStyle: {
- normal: {
- label: {
- show: true,
- position: 'top',
- textStyle: {
- color: '#000'
- },
- fontSize: 30
- }
- }
- },
- }
- ]
- }
- }
- getData('./json/jdp.json').then(data => {
- var list = data.GDP
- var myChart = echarts.init(document.getElementById('gdpmain'));
- var option = getBarg(list, '%');
- myChart.setOption(option, true);
- })
- getData('./json/scale.json').then(data => {
- var myChartScale = echarts.init(document.getElementById('scalemain'))
- var option = getBarl(data.scale, '%');
- myChartScale.setOption(option, true);
- })
- getData('./json/fixedAssets.json').then(data => {
- var myChartConstruction = echarts.init(document.getElementById('fixedAssetsmain'))
- var option = getBarl(data.fixedAssets, '%');
- myChartConstruction.setOption(option, true);
- })
- function getBarl(list, unit) {
- // var dateNum = ['date'];
- var dateNum = [];
- var alloneBasis = [];
- var growth = [];
- var allData = ['季度'];
- for (var i = 0; i < list.length; i++) {
- for (var j = 1; j <= list[i].totalNum.length; j++) {
- var str = ' ';
- if (j == 1) {
- str = list[i].date + '年' + ' ' + '第1季度';
- dateNum.push(str);
- } else {
- str = list[i].date + '年' + ' ' + '第1~' + j + '季度';
- dateNum.push(str);
- }
- }
- var totalNumList = list[i].totalNum;
- for (var k = 0; k < totalNumList.length; k++) {
- allData.push(totalNumList[k]);
- }
- var alloneBasisList = list[i].alloneBasis;
- for (var n = 0; n < alloneBasisList.length; n++) {
- alloneBasis.push(alloneBasisList[n]);
- }
- var growthList = list[i].growth;
- if (list[i].growth) {
- for (var n = 0; n < growthList.length; n++) {
- growth.push(growthList[n]);
- }
- }
- };
- var sourceData = [dateNum, alloneBasis];
- return {
- legend: {
- textStyle:{
- fontSize: 30
- }
- },
- grid: {
- left: '2%',
- right: '10%',
- bottom: '-2%',
- containLabel: true
- },
- dataZoom:[//x轴滑动条
- {
- type: 'slider',
- show: true,
- xAxisIndex: [0],
- start: 0, //初始化时,滑动条宽度开始标度
- bottom: '7%',
- end: 45,
- height: 2,
- fillerColor:'#3E86FF',
- showDataShadow: false,//是否显示数据阴影 默认auto
- showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
- },
- {
- type:'inside',
- xAxisIndex:0,
- zoomOnMouseWheel:false, //滚轮是否触发缩放
- moveOnMouseMove:true, //鼠标滚轮触发滚动
- moveOnMouseWheel:true
- }
- ],
- tooltip: {
- trigger: 'item',
- formatter: function (params) {
- var htmlStr = '';
- var color = params.color; //图例颜色
- var seriesName = params.seriesName; //图例名称
- var xName = params.name; //x轴的名称
- var value = params.value; //y轴值
- var htmlStr = '<div style="margin-right: 5px; font-size: 19pt;">';
- htmlStr += seriesName + '<br/>';
- htmlStr +=
- '<span style="margin-right: 5px; font-size: 19pt; font-family: Consolas;display: inline-block; width: 10px; height: 10px; border-radius: 50%; background-color:' +
- color + ' ;"></span>';
- htmlStr += "<span style='min-height: 20pt; font-size: 16pt'>";
- htmlStr += xName;
- htmlStr += '</span>';
- htmlStr += "<span style='min-height: 20pt; font-size: 16pt; margin-left: 20px'>";
- if (!value.length) {
- htmlStr += value + '%';
- } else {
- htmlStr += value[params.seriesIndex + 1] + unit; //选择对应value的坐标
- }
- htmlStr += '</span>'
- htmlStr += '</div>';
- return htmlStr;
- }
- },
- dataset: {
- source: sourceData
- },
- xAxis: [{
- type: 'category',
- axisLabel: {
- formatter: '{value}',
- interval: 0,
- rotate: -40,
- fontSize: 40
- },
- data: sourceData[0]
- },
- ],
- yAxis: [{
- gridIndex: 0,
- axisLabel: {
- formatter: '{value}' + unit,
- fontSize: 40
- }
- },
- {
- type: 'value',
- axisLabel: {
- formatter: '{value}%',
- fontSize: 40
- }
- }
- ],
- series: [
- // {
- // name: '同比增减(%)',
- // type: 'line',
- // color: ['#91CC75'],
- // yAxisIndex: 0,
- // data: alloneBasis
- // },
- {
- name: '增速(%)',
- type: 'line',
- color: ['#448BEE'],
- yAxisIndex: 0,
- data: growth,
- symbolSize: 3, //一定要加这个字段才能显示
- itemStyle: {
- normal: {
- label: {
- show: true,
- position: 'top',
- textStyle: {
- color: '#000'
- },
- fontSize:30
- }
- }
- },
- }
- ]
- }
- }
- function getBarg(list, unit) {
- // var dateNum = ['date'];
- var dateNum = [];
- var alloneBasis = [];
- var growth = [];
- var allData = ['季度'];
- for (var i = 0; i < list.length; i++) {
- for (var j = 1; j <= list[i].totalNum.length; j++) {
- var str = ' ';
- if (j == 1) {
- str = list[i].date + '年' + ' ' + '第1季度';
- dateNum.push(str);
- } else {
- str = list[i].date + '年' + ' ' + '第1~' + j + '季度';
- dateNum.push(str);
- }
- }
- var totalNumList = list[i].totalNum;
- for (var k = 0; k < totalNumList.length; k++) {
- allData.push(totalNumList[k]);
- }
- var alloneBasisList = list[i].alloneBasis;
- for (var n = 0; n < alloneBasisList.length; n++) {
- alloneBasis.push(alloneBasisList[n]);
- }
- var growthList = list[i].growth;
- if (list[i].growth) {
- for (var n = 0; n < growthList.length; n++) {
- growth.push(growthList[n]);
- }
- }
- };
- var sourceData = [dateNum, alloneBasis];
- return {
- legend: {
- textStyle:{
- fontSize: 30
- }
- },
- grid: {
- left: '2%',
- right: '10%',
- bottom: '-1%',
- width: 1000,
- containLabel: true
- },
- dataZoom:[//x轴滑动条
- {
- type: 'slider',
- show: true,
- xAxisIndex: [0],
- start: 0, //初始化时,滑动条宽度开始标度
- bottom: '7%',
- end: 45,
- height: 2,
- fillerColor:'#3E86FF',
- showDataShadow: false,//是否显示数据阴影 默认auto
- showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
- },
- {
- type:'inside',
- xAxisIndex:0,
- zoomOnMouseWheel:false, //滚轮是否触发缩放
- moveOnMouseMove:true, //鼠标滚轮触发滚动
- moveOnMouseWheel:true
- }
- ],
- tooltip: {
- trigger: 'item',
- formatter: function (params) {
- // console.log(params);
- var htmlStr = '';
- var color = params.color; //图例颜色
- var seriesName = params.seriesName; //图例名称
- var xName = params.name; //x轴的名称
- var value = params.value; //y轴值
- var htmlStr = '<div style="margin-right: 5px; font-size: 19pt;">';
- htmlStr += seriesName + '<br/>';
- htmlStr +=
- '<span style="margin-right: 5px; font-size: 19pt; font-family: Consolas;display: inline-block; width: 10px; height: 10px; border-radius: 50%; background-color:' +
- color + ' ;"></span>';
- htmlStr += "<span style='min-height: 20pt; font-size: 16pt'>";
- htmlStr += xName;
- htmlStr += '</span>';
- htmlStr += "<span style='min-height: 20pt; font-size: 16pt; margin-left: 20px'>";
- // console.log(params.data.length);
- if (!value.length) {
- htmlStr += value + '%';
- } else {
- htmlStr += value[params.seriesIndex + 1] + unit; //选择对应value的坐标
- }
- htmlStr += '</span>'
- htmlStr += '</div>';
- return htmlStr;
- }
- },
- dataset: {
- source: sourceData
- },
- xAxis: [{
- type: 'category',
- axisLabel: {
- formatter: '{value}',
- interval: 0,
- rotate: -40,
- fontSize: 40
- },
- data: sourceData[0]
- },
- ],
- yAxis: [{
- gridIndex: 0,
- axisLabel: {
- formatter: '{value}' + unit,
- fontSize: 40
- }
- },
- {
- type: 'value',
- axisLabel: {
- formatter: '{value}%',
- fontSize: 40
- }
- }
- ],
- series: [
- // {
- // name: '同比增减(%)',
- // type: 'line',
- // color: ['#91CC75'],
- // yAxisIndex: 0,
- // data: alloneBasis
- // },
- {
- name: '同比增减(%)',
- type: 'line',
- color: ['#91CC75'],
- yAxisIndex: 0,
- fontSize:40,
- data: growth,
- symbolSize: 3, //一定要加这个字段才能显示
- itemStyle: {
- normal: {
- label: {
- show: true,
- position: 'top',
- textStyle: {
- color: '#000'
- },
- fontSize:30
- }
- }
- },
- }
- ]
- }
- }
- function getOtherBar(list, unit) {
- var dateNum = ['date'];
- for (var i = 0; i < list.length; i++) {
- if (list[i].subData[0].data.firstFourQuarter) {
- for (var j = 1; j <= 4; j++) {
- var str = ' ';
- if (j == 1) {
- str = list[i].date + '年' + ' ' + '第1季度';
- dateNum.push(str);
- } else {
- str = list[i].date + '年' + ' ' + '第1~' + j + '季度';
- dateNum.push(str);
- }
- }
- } else {
- for (var j = 1; j <= 3; j++) {
- var str = ' ';
- if (j == 1) {
- str = list[i].date + '年' + ' ' + '第1季度';
- dateNum.push(str);
- } else {
- str = list[i].date + '年' + ' ' + '第1~' + j + '季度';
- dateNum.push(str);
- }
- }
- }
- };
- var listZero = list[0].subData;
- var listName = {};
- for (var n = 0; n < listZero.length; n++) {
- const name = listZero[n].subName;
- // console.log(name);
- const quarter = ['季度'];
- var alloneBasis = [];
- for (let i = 0; i < list.length; i++) {
- const current = list[i].subData.find(item => item.subName === name).data;
- quarter.push(current.firstQuarter.totalQuarter);
- alloneBasis.push(current.firstQuarter.oneBasis);
- if (current.firstSecondQuarter) {
- quarter.push(current.firstSecondQuarter.totalQuarter);
- alloneBasis.push(current.firstSecondQuarter.oneBasis);
- }
- if (current.firstThridQuarter) {
- quarter.push(current.firstThridQuarter.totalQuarter);
- alloneBasis.push(current.firstThridQuarter.oneBasis);
- }
- if (current.firstFourQuarter) {
- quarter.push(current.firstFourQuarter.totalQuarter);
- alloneBasis.push(current.firstFourQuarter.oneBasis);
- }
- }
- var sourceData = [dateNum, quarter];
- }
- return function getOption(k) {
- const quarter3 = ['季度'];
- var alloneBasis = [];
- for (let i = 0; i < list.length; i++) {
- const current = list[i].subData.find(item => item.subName === k);
- if (current) {
- const currentList = list[i].subData.find(item => item.subName === k).data;
- quarter3.push(currentList.firstQuarter.totalQuarter);
- alloneBasis.push(currentList.firstQuarter.oneBasis);
- if (currentList.firstSecondQuarter) {
- quarter3.push(currentList.firstSecondQuarter.totalQuarter);
- alloneBasis.push(currentList.firstSecondQuarter.oneBasis);
- }
- if (currentList.firstThridQuarter) {
- quarter3.push(currentList.firstThridQuarter.totalQuarter);
- alloneBasis.push(currentList.firstThridQuarter.oneBasis);
- }
- if (currentList.firstFourQuarter) {
- quarter3.push(currentList.firstFourQuarter.totalQuarter);
- alloneBasis.push(currentList.firstFourQuarter.oneBasis);
- }
- }
- }
- var sourceData = [dateNum, quarter3];
- return {
- legend: {
- textStyle:{
- fontSize: 30
- }
- },
- grid: {
- left: '2%',
- right: '10%',
- bottom: '5%',
- containLabel: true
- },
- dataZoom:[//x轴滑动条
- {
- type: 'slider',
- show: true,
- xAxisIndex: [0],
- start: 0, //初始化时,滑动条宽度开始标度
- bottom: '7%',
- end: 45,
- height: 2,
- fillerColor:'#3E86FF',
- showDataShadow: false,//是否显示数据阴影 默认auto
- showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
- },
- {
- type:'inside',
- xAxisIndex:0,
- zoomOnMouseWheel:false, //滚轮是否触发缩放
- moveOnMouseMove:true, //鼠标滚轮触发滚动
- moveOnMouseWheel:true
- }
- ],
- tooltip: {
- trigger: 'item',
- formatter: function (params) {
- var htmlStr = '';
- var color = params.color; //图例颜色
- var seriesName = params.seriesName; //图例名称
- var xName = params.name; //x轴的名称
- var value = params.value; //y轴值
- var htmlStr = '<div style="margin-right: 5px; font-size: 20pt;">';
- htmlStr += seriesName + '<br/>';
- htmlStr +=
- '<span style="margin-right: 5px; font-size: 20pt; font-family: Consolas;display: inline-block; width: 10px; height: 10px; border-radius: 50%; background-color:' +
- color + ' ;"></span>';
- htmlStr += "<span style='min-height: 20pt; font-size: 17pt'>";
- htmlStr += xName;
- htmlStr += '</span>';
- htmlStr += "<span style='min-height: 20pt; font-size: 17pt; margin-left: 20px'>";
- if (!value.length) {
- htmlStr += value + '%';
- } else {
- htmlStr += value[params.seriesIndex + 1] + unit; //选择对应value的坐标
- }
- htmlStr += '</span>'
- htmlStr += '</div>';
- return htmlStr;
- }
- },
- dataset: {
- source: sourceData
- },
- xAxis: [{
- type: 'category',
- gridIndex: 0,
- axisLabel: {
- formatter: '{value}',
- interval: 0,
- rotate: -40,
- fontSize: 40
- }
- },
- ],
- yAxis: [{
- gridIndex: 0,
- axisLabel: {
- formatter: '{value}' + unit,
- fontSize: 20
- }
- },
- {
- type: 'value',
- axisLabel: {
- formatter: '{value}%',
- fontSize: 20
- }
- }
- ],
- series: [
- {
- type: 'bar',
- seriesLayoutBy: 'row',
- itemStyle: {
- normal: {
- color: function (params) {
- // build a color map as your need.
- var colorList = [
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- '#93BEF9', '#6AA3F3', '#448BEE', '#2A7BED',
- ];
- return colorList[params.dataIndex]
- },
- }
- },
- },
- {
- name: '同比增减(%)',
- type: 'line',
- color: ['#91CC75'],
- // itemStyle: {
- // normal: {
- // color: rgb(115,192,222)
- // }
- // },
- yAxisIndex: 1,
- data: alloneBasis,
- symbolSize: 3, //一定要加这个字段才能显示
- itemStyle: {
- normal: {
- label: {
- show: true,
- position: 'top',
- textStyle: {
- color: '#000'
- },
- fontSize:30
- }
- }
- },
- }
- ]
- }
- }
- }
- function getLine(list, unit) {
- var chart = {
- tooltip: {
- trigger: 'axis',
- },
- dataZoom:[//x轴滑动条
- {
- type: 'slider',
- show: true,
- xAxisIndex: [0],
- start: 0, //初始化时,滑动条宽度开始标度
- bottom: '7%',
- end: 45,
- height: 2,
- fillerColor:'#3E86FF',
- showDataShadow: false,//是否显示数据阴影 默认auto
- showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
- },
- {
- type:'inside',
- xAxisIndex:0,
- zoomOnMouseWheel:false, //滚轮是否触发缩放
- moveOnMouseMove:true, //鼠标滚轮触发滚动
- moveOnMouseWheel:true
- }
- ],
- grid: {
- left: '3%',
- right: '4%',
- bottom: '3%',
- containLabel: true
- },
- toolbox: {
- show: true,
- x: 'right',
- y: 'top',
- feature: {
- saveAsImage: {
- pixelRatio: 1,
- name: '导出的文件名',
- title: '保存图片',
- emphasis: {
- iconStyle: {
- textAlign: 'right', //文字在图标在右边
- textPosition: 'left', //文字与图标在一行
- },
- }
- }
- }
- },
- xAxis: {
- type: 'category',
- boundaryGap: 1,
- data: list[0].xdata,
- axisLabel: {
- interval: 0,
- rotate: 40,
- fontSize: 40
- }
- },
- yAxis: {
- type: 'value',
- axisLabel: {
- formatter: '{value}' + unit,
- fontSize: 40
- }
- }
- };
- var series = [];
- var tolstr = [];
- for (var i = 0; i < list.length; i++) {
- series.push({
- name: list[i].name,
- type: 'bar',
- stack: '总量',
- symbol: 'none',
- data: list[i].data,
- itemStyle: {
- normal: {
- color: list[i].color1
- }
- },
- })
- tolstr.push(list[i].color1);
- }
- chart.series = series;
- chart.tooltip.formatter = function (v) {
- var str = '';
- var res = "<div>" + v[0].axisValue + "</div>";
- var result = ''
- v.forEach(function (item, index) {
- result +=
- `<span style="display:inline-block;margin-right:5px;margin-bottom:2px;border-radius:10px;width:9px;height:9px;background:` +
- tolstr[index] + `;"></span>`
- result += item.seriesName + ":" + item.data + unit + "<br>";
- })
- str = res + result
- return str;
- }
- return chart;
- }
- function getLinel(list, unit) {
- var chart = {
- tooltip: {
- trigger: 'axis',
- },
- grid: {
- left: '3%',
- right: '4%',
- bottom: '3%',
- containLabel: true
- },
- toolbox: {
- show: true,
- x: 'right',
- y: 'top',
- feature: {
- saveAsImage: {
- pixelRatio: 1,
- name: '导出的文件名',
- title: '保存图片',
- emphasis: {
- iconStyle: {
- textAlign: 'right', //文字在图标在右边
- textPosition: 'left', //文字与图标在一行
- },
- }
- }
- }
- },
- xAxis: {
- type: 'category',
- boundaryGap: false,
- data: list[0].xdata,
- axisLabel: {
- interval: 0,
- rotate: 40,
- fontSize: 40
- }
- },
- yAxis: {
- type: 'value',
- axisLabel: {
- formatter: '{value}' + unit,
- fontSize: 40
- }
- }
- };
- var series = [];
- var tolstr = [];
- for (var i = 0; i < list.length; i++) {
- series.push({
- name: list[i].name,
- type: 'line',
- // type: 'bar',
- // stack: '增速',
- // symbol: 'none',
- data: list[i].data,
- symbolSize: 3, //一定要加这个字段才能显示
- itemStyle: {
- normal: {
- color: list[i].color1,
- label: {
- show: true,
- position: 'top',
- textStyle: {
- color: '#000'
- }
- }
- }
- }
- })
- tolstr.push(list[i].color1);
- }
- chart.series = series;
- chart.tooltip.formatter = function (v) {
- var str = '';
- var res = "<div>" + v[0].axisValue + "</div>";
- var result = ''
- v.forEach(function (item, index) {
- result +=
- `<span style="display:inline-block;margin-right:5px;margin-bottom:2px;border-radius:10px;width:9px;height:9px;background:` +
- tolstr[index] + `;"></span>`
- result += item.seriesName + ":" + item.data + unit + "<br>";
- })
- str = res + result
- return str;
- }
- return chart;
- }
- function getAllLine(list) {
- var dateList = [];
- var listThri = [];
- for (var i = 0; i < list.length; i++) {
- dateList.push(list[i].date);
- listThri.push(list[i].totalNum[3]);
- }
- return {
- grid: {
- left: '3%',
- right: '4%',
- bottom: '3%',
- containLabel: true
- },
- toolbox: {
- show: true,
- x: 'right',
- y: 'top',
- feature: {
- saveAsImage: {
- pixelRatio: 1,
- name: '导出的文件名',
- title: '保存图片',
- emphasis: {
- iconStyle: {
- textAlign: 'right', //文字在图标在右边
- textPosition: 'left', //文字与图标在一行
- },
- }
- }
- }
- },
- xAxis: {
- type: 'category',
- boundaryGap: 1,
- data: dateList
- },
- yAxis: {
- type: 'value'
- },
- series: [{
- name: '视频广告',
- type: 'bar',
- stack: '总量',
- symbol: 'none',
- data: listThri,
- lineStyle: {
- normal: {
- width: 4,
- color: {
- type: 'linear',
- colorStops: [{
- offset: 0,
- color: '#0090f4'
- }, {
- offset: 1,
- color: '#5efff5'
- }],
- globalCoord: false
- },
- }
- },
- }
- ]
- }
- }
- //时间
- var t = null;
- t = setTimeout(time, 1000); //開始运行
- function time() {
- clearTimeout(t); //清除定时器
- dt = new Date();
- var y = dt.getFullYear();
- var mt = showDateNum(dt.getMonth() + 1);
- var day = showDateNum(dt.getDate());
- var mon = showMonNum(dt.getDay()); //获取星期
- var h = showDateNum(dt.getHours()); //获取时;
- var m = showDateNum(dt.getMinutes()); //获取分
- var s = showDateNum(dt.getSeconds()); //获取秒
- document.querySelector(".timeDeatil").innerHTML = h + ':' + m + ':' + s;
- document.querySelector(".dateMon").innerHTML = mon;
- document.querySelector(".dateDeatil").innerHTML = y + '-' + mt + '-' + day;
- t = setTimeout(time, 1000); //设定定时器,循环运行
- }
- //处理日期数字
- function showDateNum(num) {
- if (num < 10) {
- return '0' + num
- }
- return num
- }
- //处理星期
- function showMonNum(num) {
- switch (num) {
- case 1:
- num = '星期一';
- break;
- case 2:
- num = '星期二';
- break;
- case 3:
- num = '星期三';
- break;
- case 4:
- num = '星期四';
- break;
- case 5:
- num = '星期五';
- break;
- case 6:
- num = '星期六';
- break;
- case 0:
- num = '星期日';
- break;
- }
- return num
- }
- //阿拉伯数字转中文数字
- function NoToChinese(num) {
- if (!/^\d*(\.\d*)?$/.test(num)) {
- alert("Number is wrong!");
- return "Number is wrong!";
- }
- var AA = new Array("零", "一", "二", "三", "四", "五", "六", "七", "八", "九");
- var BB = new Array("", "十", "百", "千", "万", "亿", "点", "");
- var a = ("" + num).replace(/(^0*)/g, "").split("."),
- k = 0,
- re = "";
- for (var i = a[0].length - 1; i >= 0; i--) {
- switch (k) {
- case 0:
- re = BB[7] + re;
- break;
- case 4:
- if (!new RegExp("0{4}\\d{" + (a[0].length - i - 1) + "}$").test(a[0]))
- re = BB[4] + re;
- break;
- case 8:
- re = BB[5] + re;
- BB[7] = BB[5];
- k = 0;
- break;
- }
- if (k % 4 == 2 && a[0].charAt(i + 2) != 0 && a[0].charAt(i + 1) == 0) re = AA[0] + re;
- if (a[0].charAt(i) != 0) re = AA[a[0].charAt(i)] + BB[k % 4] + re;
- k++;
- }
- if (a.length > 1) //加上小数部分(如果有小数部分)
- {
- re += BB[6];
- for (var i = 0; i < a[1].length; i++) re += AA[a[1].charAt(i)];
- }
- return re;
- };
|