From 39a87968ce6f597b48592f1e0ff11fbf7f5dba31 Mon Sep 17 00:00:00 2001 From: chenbiao Date: Tue, 21 Nov 2017 15:08:32 +0800 Subject: [PATCH] pda wechart --- css/pdalatform.css | 0 css/wechatlatform.css | 0 index.html | 4 ++-- js/pdalatform.js | 120 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ js/wechatlatform.js | 120 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ pdalatform.html | 538 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ wechatlatform.html | 537 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 7 files changed, 1317 insertions(+), 2 deletions(-) create mode 100644 css/pdalatform.css create mode 100644 css/wechatlatform.css create mode 100644 js/pdalatform.js create mode 100644 js/wechatlatform.js create mode 100644 pdalatform.html create mode 100644 wechatlatform.html diff --git a/css/pdalatform.css b/css/pdalatform.css new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/css/pdalatform.css diff --git a/css/wechatlatform.css b/css/wechatlatform.css new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/css/wechatlatform.css diff --git a/index.html b/index.html index bfb58f9..1891f80 100644 --- a/index.html +++ b/index.html @@ -32,10 +32,10 @@
  • 任你停
  • -
  • +
  • PDA
  • -
  • +
  • 微信服务号
  • diff --git a/js/pdalatform.js b/js/pdalatform.js new file mode 100644 index 0000000..ce6f6b9 --- /dev/null +++ b/js/pdalatform.js @@ -0,0 +1,120 @@ +var fun = { + init:function () { + var myChart = echarts.init(document.getElementById('echart-main')); + + // 指定图表的配置项和数据 + var option = { + tooltip : { + trigger: 'axis', + formatter:'{a}:
    {b}: {c}', + axisPointer: { + type: 'line', + label: { + backgroundColor: '#6a7985' + }, + lineStyle:{ + color:'#2abb9b' + } + }, + + }, + grid: { + left: '0', + right: '3%', + bottom: '0', + top:'3%', + containLabel: true + }, + xAxis : [ + { + boundaryGap: false, + type : 'category', + boundaryGap : false, + data : ['周一','周二','周三','周四','周五','周六','周日'], + axisTick:{ + show:false, + }, + axisLine:{ + lineStyle:{ + color:'#e5e5e5', + } + }, + splitLine:{ + show:false, + }, + axisLabel: { + show: true, + textStyle: { + color: '#333' + } + } + } + ], + yAxis : [ + { + boundaryGap: false, + type : 'value', + axisTick:{ + show:false, + }, + axisLine:{ + lineStyle:{ + color:'#e5e5e5', + } + }, + splitLine:{ + show:false, + }, + axisLabel: { + show: true, + textStyle: { + color: '#333' + } + } + } + ], + series : [ + { + smooth:true, + name:'接入接口统计', + // symbol:'image://./../image/symbol.png', + symbol:'image://image/symbol.png', + symbolOffset:[0,5], + symbolSize:26, + type:'line', + stack: '总量', + areaStyle: {normal: { + color:'rgba(38,190,150,.1)' + }}, + lineStyle:{ + normal: { + color:'#2abb9b', + width:3, + } + }, + data:[120, 132, 101, 134, 90, 230, 210] + }, + + ] + }; + + + // 使用刚指定的配置项和数据显示图表。 + myChart.setOption(option); + }, +}; +fun.init(); +$('#link-div span').on('click',function () { + var index = $(this).index(); + $(this).addClass('linkActive').siblings('span').removeClass('linkActive'); + $('#link-con .link-con-1').addClass('display-none'); + $('#link-con .link-con-1').eq(index).removeClass('display-none'); + $('#list-detail-wrap').addClass('display-none'); + $('#list-main-wrap').removeClass('display-none'); +}); +$(document).delegate('#list-con-wrap li span','click',function () { + var id = $(this).attr('data-id'); + alert(id); + $('#list-main-wrap').addClass('display-none'); + $('#list-detail-wrap').removeClass('display-none'); +}); \ No newline at end of file diff --git a/js/wechatlatform.js b/js/wechatlatform.js new file mode 100644 index 0000000..ce6f6b9 --- /dev/null +++ b/js/wechatlatform.js @@ -0,0 +1,120 @@ +var fun = { + init:function () { + var myChart = echarts.init(document.getElementById('echart-main')); + + // 指定图表的配置项和数据 + var option = { + tooltip : { + trigger: 'axis', + formatter:'{a}:
    {b}: {c}', + axisPointer: { + type: 'line', + label: { + backgroundColor: '#6a7985' + }, + lineStyle:{ + color:'#2abb9b' + } + }, + + }, + grid: { + left: '0', + right: '3%', + bottom: '0', + top:'3%', + containLabel: true + }, + xAxis : [ + { + boundaryGap: false, + type : 'category', + boundaryGap : false, + data : ['周一','周二','周三','周四','周五','周六','周日'], + axisTick:{ + show:false, + }, + axisLine:{ + lineStyle:{ + color:'#e5e5e5', + } + }, + splitLine:{ + show:false, + }, + axisLabel: { + show: true, + textStyle: { + color: '#333' + } + } + } + ], + yAxis : [ + { + boundaryGap: false, + type : 'value', + axisTick:{ + show:false, + }, + axisLine:{ + lineStyle:{ + color:'#e5e5e5', + } + }, + splitLine:{ + show:false, + }, + axisLabel: { + show: true, + textStyle: { + color: '#333' + } + } + } + ], + series : [ + { + smooth:true, + name:'接入接口统计', + // symbol:'image://./../image/symbol.png', + symbol:'image://image/symbol.png', + symbolOffset:[0,5], + symbolSize:26, + type:'line', + stack: '总量', + areaStyle: {normal: { + color:'rgba(38,190,150,.1)' + }}, + lineStyle:{ + normal: { + color:'#2abb9b', + width:3, + } + }, + data:[120, 132, 101, 134, 90, 230, 210] + }, + + ] + }; + + + // 使用刚指定的配置项和数据显示图表。 + myChart.setOption(option); + }, +}; +fun.init(); +$('#link-div span').on('click',function () { + var index = $(this).index(); + $(this).addClass('linkActive').siblings('span').removeClass('linkActive'); + $('#link-con .link-con-1').addClass('display-none'); + $('#link-con .link-con-1').eq(index).removeClass('display-none'); + $('#list-detail-wrap').addClass('display-none'); + $('#list-main-wrap').removeClass('display-none'); +}); +$(document).delegate('#list-con-wrap li span','click',function () { + var id = $(this).attr('data-id'); + alert(id); + $('#list-main-wrap').addClass('display-none'); + $('#list-detail-wrap').removeClass('display-none'); +}); \ No newline at end of file diff --git a/pdalatform.html b/pdalatform.html new file mode 100644 index 0000000..154d39e --- /dev/null +++ b/pdalatform.html @@ -0,0 +1,538 @@ + + + + + + + + + + + + + PDA + + + + + + +
    + +
    + +
    +
    +
    + +
    +
    + + +
    +
    +
    + + + + + + + + \ No newline at end of file diff --git a/wechatlatform.html b/wechatlatform.html new file mode 100644 index 0000000..bce9a5b --- /dev/null +++ b/wechatlatform.html @@ -0,0 +1,537 @@ + + + + + + + + + + + + + 微信服务号 + + + + + +
    + +
    + +
    +
    +
    + +
    +
    + + +
    +
    +
    + + + + + + + + \ No newline at end of file -- libgit2 0.21.4