如何制作图例是横向的

Question

请告诉我们如何制作水平传奇。

以下是结果：

但我想要这个：

我有以下代码：

＆＃13;

＆＃13;

<script type="text/javascript">

        //$(function () {
        function getJson() {
            var result = [];
            $.ajax({
                url: "WebService1.asmx/GetJson3",
                success: function (data) {
                    $.each(data, function (key, value) {
                        item = {
                            "company": value.BusinessUnitName,
                            "revenue": value.QTY_Case,
                            "expenses": value.QTY_Case_Target,
                            "cos": value.QTY_Case_LY
                        }
                        result.push(item);
                    });
                },
                async: false,
            });

            $("#columnChart").igDataChart({
                width: "280px",
                height: "200px",
                dataSource: result,
                legend: {
                    element: "columnLegend"
                },

                title: "title",
                subtitle: "subtitle",

                axes: [{
                    name: "xAxis",
                    type: "categoryX",
                    //label: "company",
                    labelTopMargin: 5,
                    gap: 0.4,  
                    overlap: 0.0,
 
                }, {
                    name: "yAxis",
                    type: "numericY",
                    maximumValue: 250000,
                    interval: 50,
                    minimumValue: 0,
                    formatLabel: function (val) {
                        var bVal = (val / 10000),
                        rounded = Math.round(bVal * 100) / 100;
                        return rounded + "M";
                    }
                }],
                series: [{
                    name: "series1",
                    title: "revenue",
                    type: "column",
                    isTransitionInEnabled: true,
                    xAxis: "xAxis",
                    yAxis: "yAxis",
                    valueMemberPath: "revenue"
                }, {
                    name: "series2",
                    title: "expenses",
                    type: "column",
                    isTransitionInEnabled: true,
                    xAxis: "xAxis",
                    yAxis: "yAxis",
                    valueMemberPath: "expenses"
                }, {
                    name: "series3",
                    title: "cos",
                    type: "column",
                    isTransitionInEnabled: true,
                    xAxis: "xAxis",
                    yAxis: "yAxis",
                    valueMemberPath: "cos"
                },
                ]
            });

        }
        $(function () {
            getJson();
        });

    </script>

＆＃13;

＆＃13;

＆＃13;

我希望得到指导。 谢谢， 最好的关注

Answer 1

Andrew Bone提供的链接回答了这个问题。我也会在这里发布答案，以便它可见。

使属于图例的表格行显示为git push -f origin yourbranchname。

inline-block

我根据您提供的代码提出的另一个建议是不进行#columnLegend tr { display: inline-block; } 呼叫同步。只需初始化成功回调中的$.ajax。

igDataChart