使用echars制作家谱图

使用echars制作家谱图

首次工作的第一周，项目大哥让我制作项目中的h5页面：接收后端数据渲染家谱图；各种百度发现并没有很好的解决办法，在掉头发的两天研究echars后终于解决，虽然没发完全还原ui图但也能正常使用，一下是我的解决办法：

1.首先需要引入echars，这个直接去官网学习即可
2.这个表中需要后端计算并返回每个家谱人物的x，y坐标，大概的实施方法是：在创建家谱人物时前端需要传递一个方位参数（left,right,top,bottom），表示创建的人物和本人的关系top，bottom方向为长辈和晚辈，left，right可以根据实际情况判断是平辈或者是妻子丈夫，这个不是本文重点，不多说；总之需要后端返回x，y坐标数据
3.实现代码如下

//百度图表
            initEchart() {
   
                let that = this;
               // let img_tx = '../../image/ceshi.jpg'
                //找到绘制图标的区域
                let dom = document.getElementById("container");
                //初始化echarts实例
                this.myChart = echarts.init(dom);
                con