refactor(experiment_5):重构实验 5 数据格式和图表展示

- 移除 iris.csv 和 marketing.sql 文件
- 新增 sales_manager.csv 和 sales_month.csv 文件
- 添加 sales_manager.js 文件，实现销售数据的图表展示

experiment_5/task4/js/sales_product.js

@@ -0,0 +1,81 @@
+d3.json("data/sales_product.json", function (error, data) {
+    // console.log(data);
+    var myChart = echarts.init(document.getElementById('data_product'));
+   
+    var color = [
+        "#00C6FB",
+        "#5781FD",
+        "#4DB1CB",
+        //  "#3EBD7C",
+        //  "#F7A925",
+        //  "#bda29a",
+        //  "#ca8622",
+        //  "#749f83",
+        //  "#6e7074",
+        //  "#546570",
+        //  "#c4ccd3"
+    ];
+
+    option = {
+        tooltip: {},
+        series: [{
+            name: '销售额', // 图表的名称
+            type: 'treemap', // 图表的类型树状图
+            roam: false, // 是否允许鼠标缩放和平移，这里设置为false，表示不允许
+            nodeClick: false, // 是否允许点击节点进行交互，这里设置为false，表示不允许
+            breadcrumb: false, // 是否显示导航路径，这里设置为false，表示不显示
+            // 分别设置图表的左边距、右边距、上边距和下边距，这里都设置为0。
+            left: 0,
+            right: 0,
+            top: 0,
+            bottom: 0,
+            itemStyle: {
+                borderColor: '#062e62' // 定义节点的样式，这里设置了边框颜色为'#062e62'
+            },
+            // 定义节点标签的样式，这里设置了字体大小为8，颜色为白色
+            label: {
+                fontSize: 8,
+                color: '#fff',
+            },
+            // 用于定义树状图的层级样式
+            levels: [{// 定义了多个层级的样式
+                color: color, // 设置节点的颜色
+                itemStyle: {// 定义节点的样式
+                    normal: {// 正常状态下的样式
+                        borderWidth: 0, // 边框宽度，这里设置为0，表示无边框
+                        borderColor: '#062e62', // 设置边框颜色
+                        gapWidth: 5 // 设置节点之间的间隔宽度
+                    }
+                }
+            },
+                {
+                    //colorSaturation: [0.35, 0.6],
+                    colorAlpha: [1, 0.5], // 节点颜色的透明度，这里设置为[1, 0.5]，表示正常状态下节点的颜色透明度为1，鼠标悬停时透明度为0.5。
+                    upperLabel: {// 定义上层节点标签的样式
+                        normal: {// 定义正常状态下的样式
+                            color: '#00C6FB', // 设置标签颜色
+                            fontSize: 10, // 设置标签字体大小
+                            show: true, // 是否显示标签，这里设置为true，表示显示
+                            height: 15 // 设置标签高度
+                        }
+                    },
+                    itemStyle: {// 定义节点的样式
+                        normal: {// 定义正常状态下的样式
+                            borderWidth: 5, // 设置边框宽度
+                            borderColor: '#062e62', // 设置边框颜色
+                            gapWidth: 1, // 设置节点之间的间隔宽度
+                        },
+                        emphasis: {// 定义鼠标悬停时的样式
+                            borderColor: '#ccc' // 设置边框颜色
+                        }
+                    }
+                }
+            ],
+            leafDepth: 2, // 树的叶子节点深度，其值为2
+            data: data// 数据源
+        }]
+    };
+    myChart.setOption(option)
+
+
+})