jqplot：将xaxis tick文本拆分为单词

Question

我在图表的轴上使用的标签包含多个单词的文字。像这样：

看起来很糟糕。我尝试（如图中所示）用brs或\ n替换机智空格，以便以多行渲染文本。结果不是我期望的结果。

如何将刻度线文本拆分为单词并在一行中绘制每个单词？

Answer 1

<br/>正在尝试将您的文本拆分为两行。请参阅工作示例here。

为了使它工作，不要忘记加载一些jqplot插件：CanvasAxisTickRenderer，CategoryAxisRenderer。 然后，您需要将tickRenderer: $.jqplot.CanvasAxisTickRenderer应用于您的系列。您需要将renderer: $.jqplot.CategoryAxisRenderer应用到您的y轴上。

Answer 2

对我来说，＆lt; br /＆gt;没有工作， \ n 做了。

我的配置：

jQuery.jqplot(element, configuration.series, {
        stackSeries: true,
        animate: false,
        captureRightClick: false,
        seriesColors: ['green', 'blue', 'yellow', 'orange', 'red'],
        seriesDefaults: {
            renderer: jQuery.jqplot.BarRenderer,
            rendererOptions: {
                shadowOffset: 0,
                barDirection: 'horizontal',
                highlightMouseDown: false,
                barWidth: 20,
            },
            pointLabels: {
                show: false
            }
        },
        axesDefaults: {
            min: 0,
            minorTicks: 0,
            tickOptions: {
                formatString: '%d'
            }
        },
        highlighter: {
            show: false
        },
        axes: {
            yaxis: {
                renderer: jQuery.jqplot.CategoryAxisRenderer,
                ticks: configuration.labels
            },
            xaxis: {
                ticks: configuration.ticks,
                label:'Hours',
                labelOptions:{
                    fontFamily:'Helvetica',
                    fontSize: '10pt'
                },
            }
        }
    });