y轴上的jqplot文本标签

时间:2012-07-16 12:14:37

标签: label jqplot gantt-chart

我正试图在jqplot中创建一个甘特图。我想在同一个情节中制作两个时间轴。正如您在代码和jsFiddel中看到的那样,我大部分时间都在使用它。

我手动添加了一些系列(并添加了一系列配置),这将在以后循环播放。

我现在的问题是在Y轴上我不想要数字,而是系列的文本标签(“联系人”和“Locatie”)。如果动态完成它会很好,但“硬编码”它们不是问题,因为我现在只需要两个。

我找不到这样做的例子。有任何想法吗? 这是jsFiddle:http://jsfiddle.net/NVbjv/1/

    var seriesCnf = Array();
    var loc = Array();

    // add location values
    loc.push([[1340877534000, 1, 'lagehaghorst'] , [1340877569000, 1, 'lagehaghorst' ]]);
    seriesCnf.push({color: "#941B80", label: "Locatie"});
    loc.push([[1340877779000, 1, 'weegnet'] , [1340877869000, 1, 'weegnet' ]]);
    seriesCnf.push({color: "#941B80"});
    loc.push([[1340877989000, 1, 'lagehaghorst'] , [1340878139000, 1, 'lagehaghorst' ]]);
    seriesCnf.push({color: "#941B80"});

    // add ignition values
    loc.push([[1340877534000, 2, 'uit'], [1340877561000, 2, null]]);
    seriesCnf.push({color: "#FF0000", showMarker:false, label: "Contact"});
    loc.push([[1340877561000, 2, 'aan'], [1340877779000, 2, null]]);
    seriesCnf.push({color: "#00FF00", showMarker:false, pointLabels: {location: 'n'}});
    loc.push([[1340877779000, 2, 'uit'], [1340877839000, 2, null]]);
    seriesCnf.push({color: "#FF0000", showMarker:false});
    loc.push([[1340877839000, 2, 'aan'], [1340878019000, 2, null]]);
    seriesCnf.push({color: "#00FF00", showMarker:false, pointLabels: {location: 'n'}});
    loc.push([[1340878019000, 2, 'uit'], [1340878139000, 2, null]]);
    seriesCnf.push({color: "#FF0000", showMarker:false});

    plot1 = $.jqplot('container', loc,{
        seriesColors: ["#941B80"],
        title: "Tijdlijn",
        axes: {
          xaxis: {
            renderer: $.jqplot.DateAxisRenderer,
                tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                tickOptions: {
                    formatString: '%R',
                    angle: 0
                },
          },
          yaxis: {
            min: 0,
            tickInterval: 1,
          }
        },
        seriesDefaults: {
            showMarker:true,
            pointLabels:{
                show:true,
                location:'s',
                labelsFromSeries: true,
                formatter: $.jqplot.DefaultTickFormatter,
            }
        },
        series: seriesCnf,

        grid: {
            background: '#ffffff'
        }
    });

0 个答案:

没有答案