Sobranier / github-chart

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

2021Q1新需求:

Sobranier opened this issue · comments

2021优化

O:

  1. 提高整体的交互、体验、曝光率;
  2. 目前的用户体量提升

KR:

  1. 体验以感官为准;
  2. 周活跃用户提高到2000;
  3. 项目Star过200;

Tips:

  1. 【工程】 解决目前的BUG,增加更多防错机制,调研官方是否有API;
  2. 【工程】考虑提升Echart版本;
  3. 【交互体验】整体配色提升,可以更换主题,主题可以考虑存本地或者线上;
  4. 【交互体验】渲染区域的位置提升到首屏;
  5. 【交互体验】除了现在的全年展示以外,增加几种图表,用户可以切换,可以放大显示,详见下面的需求2-1;
  6. 【宣发】掘金、公众号、知乎、V2EX等平台推广;

描述

这个工具的核心特征有两个:1、酷炫,2、用图形化的方式展示一些用户平时观察不到的信息

TODO:
1、新的设计原型、交互原型;
2、研发、发布;
3、推广宣传;
4、readme修改

$.getScript('https://cdn.jsdelivr.net/npm/simplex-noise@2.4.0/simplex-noise.js').done(function () {



var data = [[0,0,0],[1,0,0],[2,0,0],[3,0,6],[4,0,6],[5,0,0],[6,0,2],[0,1,4],[1,1,0],[2,1,0],[3,1,0],[4,1,4],[5,1,0],[6,1,0],[0,2,0],[1,2,0],[2,2,0],[3,2,0],[4,2,0],[5,2,0],[6,2,0],[0,3,14],[1,3,0],[2,3,2],[3,3,8],[4,3,6],[5,3,0],[6,3,0],[0,4,0],[1,4,4],[2,4,0],[3,4,18],[4,4,8],[5,4,0],[6,4,4],[0,5,4],[1,5,8],[2,5,10],[3,5,13],[4,5,4],[5,5,0],[6,5,0],[0,6,0],[1,6,0],[2,6,0],[3,6,0],[4,6,0],[5,6,0],[6,6,0],[0,7,0],[1,7,0],[2,7,0],[3,7,0],[4,7,0],[5,7,4],[6,7,4],[0,8,8],[1,8,2],[2,8,14],[3,8,4],[4,8,4],[5,8,0],[6,8,9],[0,9,2],[1,9,12],[2,9,3],[3,9,8],[4,9,6],[5,9,3],[6,9,0],[0,10,6],[1,10,2],[2,10,5],[3,10,16],[4,10,3],[5,10,0],[6,10,17],[0,11,17],[1,11,3],[2,11,0],[3,11,0],[4,11,1],[5,11,0],[6,11,0],[0,12,0],[1,12,0],[2,12,0],[3,12,0],[4,12,1],[5,12,0],[6,12,0],[0,13,0],[1,13,0],[2,13,1],[3,13,0],[4,13,0],[5,13,0],[6,13,6],[0,14,0],[1,14,0],[2,14,2],[3,14,4],[4,14,0],[5,14,0],[6,14,0],[0,15,0],[1,15,0],[2,15,1],[3,15,0],[4,15,0],[5,15,0],[6,15,0],[0,16,0],[1,16,8],[2,16,2],[3,16,0],[4,16,4],[5,16,0],[6,16,0],[0,17,0],[1,17,0],[2,17,0],[3,17,0],[4,17,0],[5,17,0],[6,17,0],[0,18,2],[1,18,0],[2,18,0],[3,18,2],[4,18,0],[5,18,0],[6,18,0],[0,19,8],[1,19,2],[2,19,2],[3,19,0],[4,19,0],[5,19,17],[6,19,14],[0,20,6],[1,20,6],[2,20,10],[3,20,6],[4,20,6],[5,20,4],[6,20,0],[0,21,8],[1,21,14],[2,21,16],[3,21,14],[4,21,4],[5,21,0],[6,21,2],[0,22,14],[1,22,9],[2,22,10],[3,22,32],[4,22,9],[5,22,18],[6,22,8],[0,23,16],[1,23,8],[2,23,8],[3,23,19],[4,23,10],[5,23,0],[6,23,0],[0,24,1],[1,24,2],[2,24,2],[3,24,0],[4,24,12],[5,24,0],[6,24,0],[0,25,2],[1,25,3],[2,25,3],[3,25,2],[4,25,14],[5,25,2],[6,25,1],[0,26,2],[1,26,2],[2,26,3],[3,26,7],[4,26,4],[5,26,0],[6,26,0],[0,27,1],[1,27,3],[2,27,0],[3,27,6],[4,27,5],[5,27,0],[6,27,0],[0,28,0],[1,28,3],[2,28,0],[3,28,0],[4,28,1],[5,28,0],[6,28,0],[0,29,5],[1,29,0],[2,29,3],[3,29,2],[4,29,10],[5,29,0],[6,29,0],[0,30,0],[1,30,1],[2,30,9],[3,30,3],[4,30,5],[5,30,0],[6,30,0],[0,31,7],[1,31,13],[2,31,9],[3,31,9],[4,31,13],[5,31,1],[6,31,0],[0,32,9],[1,32,12],[2,32,11],[3,32,16],[4,32,1],[5,32,1],[6,32,0],[0,33,14],[1,33,8],[2,33,15],[3,33,11],[4,33,11],[5,33,2],[6,33,0],[0,34,10],[1,34,23],[2,34,16],[3,34,11],[4,34,12],[5,34,0],[6,34,0],[0,35,9],[1,35,25],[2,35,11],[3,35,14],[4,35,15],[5,35,2],[6,35,0],[0,36,5],[1,36,4],[2,36,3],[3,36,8],[4,36,11],[5,36,2],[6,36,0],[0,37,11],[1,37,10],[2,37,13],[3,37,4],[4,37,5],[5,37,1],[6,37,0],[0,38,0],[1,38,1],[2,38,0],[3,38,10],[4,38,1],[5,38,9],[6,38,9],[0,39,1],[1,39,0],[2,39,0],[3,39,1],[4,39,0],[5,39,0],[6,39,0],[0,40,10],[1,40,21],[2,40,13],[3,40,10],[4,40,12],[5,40,2],[6,40,7],[0,41,21],[1,41,9],[2,41,3],[3,41,4],[4,41,4],[5,41,0],[6,41,0],[0,42,6],[1,42,6],[2,42,7],[3,42,0],[4,42,1],[5,42,0],[6,42,0],[0,43,5],[1,43,0],[2,43,3],[3,43,2],[4,43,0],[5,43,2],[6,43,0],[0,44,3],[1,44,1],[2,44,2],[3,44,1],[4,44,2],[5,44,0],[6,44,0],[0,45,1],[1,45,1],[2,45,0],[3,45,1],[4,45,5],[5,45,3],[6,45,0],[0,46,2],[1,46,3],[2,46,0],[3,46,1],[4,46,0],[5,46,0],[6,46,0],[0,47,0],[1,47,3],[2,47,0],[3,47,2],[4,47,0],[5,47,0],[6,47,1],[0,48,0],[1,48,0],[2,48,0],[3,48,0],[4,48,0],[5,48,0],[6,48,0],[0,49,0],[1,49,2],[2,49,0],[3,49,0],[4,49,1],[5,49,0],[6,49,0],[0,50,2],[1,50,0],[2,50,0],[3,50,1],[4,50,6],[5,50,0],[6,50,0],[0,51,0],[1,51,3],[2,51,0],[3,51,0],[4,51,0],[5,51,0],[6,51,0],[0,52,0]]
console.log(data)

myChart.setOption(option = {
    tooltip: {},
    xAxis3D: {
        type: 'value',
        max: 6
    },
    yAxis3D: {
        type: 'value',
    },
    zAxis3D: {
        type: 'value',
        // max: 10,
        min: 0
    },
    grid3D: {
        environment: '#000',
        axisPointer: {
            show: false
        },
        postEffect: {
            enable: true,
            SSAO: {
                enable: true,
                radius: 5
            }
        },
        light: {
            main: {
                intensity: 3
            },
            ambientCubemap: {
                texture: ROOT_PATH + '/data-gl/asset/pisa.hdr',
                exposure: 1,
                diffuseIntensity: 0.5,
                specularIntensity: 2
            }
        }
    },
    series: [{
        type: 'bar3D',
        data: data,

        barSize: 4,

        bevelSize: 0.8,
        bevelSmoothness:9,

        shading: 'realistic',
        realisticMaterial: {
            roughness: 0.3,
            metalness: 1
        },

        label: {
            textStyle: {
                fontSize: 16,
                borderWidth: 1
            }
        },

        itemStyle: {
            color: '#ccc'
        },

        emphasis: {
            label: {
                show: false
            }
        }
    }]
});

});

WX20210111-094242@2x

【需求2-1】我们的切换方式也可以参考这种,可以切换原图、渲染过的3D(一年以内的提交)

以周为