Dhtmlx 条形图文本出父 div

Question

这是我的代码：

HTML

<div id="shared-learning-chart"></div>

JS

const sharedLearningBarChartConfig = {
            type: "xbar",
            css: "dhx_widget--bg_white dhx_widget--bordered shared-learning-chart",
            scales: {
                "bottom": {
                    title: "",
                },
                "left": {
                    text: "alert_type"
                }
            },
            series: [
                {
                    id: "A",
                    value: "record_count",
                    fill: "#394E79",
                    color: "none"
                }
            ],
            legend: {
                series: ["A"],
                form: "rect",
                valign: "top",
                halign: "right"
            }
        };
        const sharedLearningBarChart = new dhx.Chart("shared-learning-chart", sharedLearningBarChartConfig);
         const sharedLearningBarChartData = [
                    { alert_type: "Incident", "record_count": 25 },
                    { alert_type: "Near Miss", "record_count": 6 },
                    { alert_type: "High Risk Condition", "record_count": 5 },
                    { alert_type: "Policy Procedure", "record_count": 1 },
                ];
        sharedLearningBarChart.data.parse(sharedLearningBarChartData);

这里左边的文字是从div中出来的。尝试添加边距和填充但没有成功。有了这个，它甚至在边界上移动。

工作代码示例

Answer 1

感谢您的报告。 我们将尝试在未来的更新中找到解决方案。 现在我可以建议您旋转比例文本并更改其填充，例如： https://snippet.dhtmlx.com/nnymqyrs 这可能有助于适应标题。

Answer 2

有更好的解决方案。 您可以使用左侧刻度的 "size" 属性来定义为刻度标题保留的空间。 喜欢： https://snippet.dhtmlx.com/kvu3jrpp