标签: jqplot

是否有任何正文都有一个简单的工作示例来打印JQPlot图.

我正在苦苦挣扎.

我需要在IE和Chrome中打印它,我甚至愿意使用基于浏览器检测的2种不同方法.

此外,我需要打印X和Y轴标签以及图表.

任何帮助将受到高度赞赏.

Ragards

我正在利用jqPlot创建一个Y轴从0%到100%的线性图表.我遇到的问题是其中一个值落在X轴(0%)或100%,它被图表的轴或边界切断.

如何确保不发生这种情况,同时保持Y轴最小值为0%,最大值保持在100%？

我使用jqPlot绘制一个区域图与系列默认fill: true, fillToZero: true与useNegativeColors默认true.我可以改变color,fillColor但我没有找到一种方法如何改变线条颜色或填充零x轴线以下的颜色.我想要一个带绿色和负值红色的正值.目前负值默认为蓝色.这是jqPlot选项:

var chartOptions = {
    title: { show: false },
    axesDefaults: {
        show: false,
        showGridline: false,
        borderWidth: 0,
        showTicks: false,
        showTickMarks: false,
        tickOptions: {
            show: false,
            showLabel: false,
            showMark: false,
            showGridline: false
        }
    },
    axes: {
        xaxis: { min: 0, max: 10 },
        yaxis: { min: -5, max: 5 }
    },
    seriesDefaults: {
        fill: true,
        fillToZero: true, …

我正在尝试将整个jqplot条形图(包括它的图例和图表标题)转换为图像.但是,使用toDataURL和这篇文章中的步骤(将画布转换为图像并使用ruby on rails和javascript在新窗口中打开),我只能将图表的轴和轴标签转换为图像.

由于图例和图表标题未在画布上呈现,因此不会转换它们.

有人能告诉我如何用画布转换图表标题和图例吗？

基本上,我希望用户能够通过单击下拉菜单来更改图表的类型:BarRenderer,PieRenderer等.数据是相同的.我知道我可以在同一个元素上再次调用$ .jqplot(),但是我必须再次传递所有设置.而且我的页面有可变数量的图表,这使得该选项成为一个非常糟糕的选择.

我找到了一个关于此的链接:http://groups.google.com/group/jqplot-users/browse_thread/thread/efe6511cd9496f16/5c625baf78d3b0ae但似乎我仍然需要再次调用$ .jqplot().

有一个更好的方法吗？还有一个小问题:它只是我,还是关于jqplot的文档很糟糕？我必须通过多个地方来查找我想要的选项(有时,该选项没有记录,或者我无法以某种方式找到它).你如何学习如何使用jqplot？

我似乎无法将我的jqplot条形图叠加起来.我有以下代码:

// Pass/Fail rates per request
$.jqplot('passFailPerRequestStats', [passRate, failRate], {
    title: 'Automation Pass Count Per Test Plan',
    //stackSeries: true,
    seriesDefaults: {
        renderer: $.jqplot.BarRenderer,
        renderOptions: { barMargin: 25 },
        pointLabels: { show: true, stackedValue: true }
    },
    axesDefaults: {
        tickRenderer: $.jqplot.CanvasAxisTickRenderer,
        tickOptions: {
            angle: -30,
            fontSize: '10pt'
        }
    },
    axes: {
        xaxis: {
            renderer: $.jqplot.CategoryAxisRenderer
        }
    }
});

这样可以成功显示两个系列的并排条形图.但是,当我尝试通过取消注释来叠加它们时,stackSeries: true,所有条形图都从图形中取出(并且所有点标签都显示在Y轴标签上).

我究竟做错了什么？

我想在我的图表上根据y轴值显示3个颜色区域,据我所知,我无法通过不同的颜色控制背景颜色.

我的想法是用canvasOverlay绘制3条水平线 - 这是有效的.问题是我想把这条线放在我的图形曲线后面,现在它在前面看到它覆盖了我的点线.

我可以更改z-index的属性或不透明度吗？

也许其他一些想法？

  $.jqplot( 'ChartDIV', [data],
        {
            series: [{ showMarker: true}],
            highlighter: {
                sizeAdjust: 10,
                show: true,
                tooltipLocation: 'n',
                useAxesFormatters: true
            },

            tickOptions: {
                formatString: '%d'
            },
            canvasOverlay: {
                show: true,
                objects: [ 
                            {
                                horizontalLine: 
                                {      
                                    name: 'low', 
                                    y: 1.0,
                                    lineWidth: 100,
                                    color: 'rgb(255, 0, 0)',
                                    shadow: false 
                                }
                            },      
                            {
                                horizontalLine:
                                { 
                                    name: 'medium',
                                    y: 2.0,
                                    lineWidth: 100, 
                                    color: 'rgb(250, 250, 0)', 
                                    shadow: true 
                                }
                            },
                            {
                                 horizontalLine:
                                {
                                    name: 'high',
                                    y: 3.0,
                                    lineWidth: 100,
                                    color: …

我可以使用EnhancedLegendRenderer插件获得jqplot图的水平图例.但我需要在图底部的水平图例.任何建议？

我想用折线图在浏览器中显示一些数据.在x轴应该有日期,在y轴应该有值.

我知道那里有一些javascript绘图解决方案.但特别是对于特定日期的数据,很难找到合适的解决方案.

这是方案,我如何获得数据:

[
   [
      startTimestamp,
      endTimestamp,
      value
   ],
   [
      startTimestamp,
      endTimestamp,
      value
   ]
]

这里有一些示例值:

[
   [
      1365163327,
      1365163339,
      0
   ],
   [
      1365163339,
      1365163360,
      1
   ]
]

请参阅此处的js-fiddle,其中包含一些更好的示例数据:

http://jsfiddle.net/JWhmQ/1992/

是否可以使用jqplot制作图形,如下所示？最接近可能的图表是stacked使用该着色以及点标签是一个问题.

这个jsfiddle包含我努力制作这个条形图以及它的图例和点标签.因此可以使它看起来像图像.

var barchart = $.jqplot('chart1', [s1, s2, s3], {
    animate: true,
    grid: {
        background: 'white',
        drawBorder:false,
        shadow: false
    },

    seriesColors: ['#73C6E8', '#F28570', '#727272'],
    seriesDefaults: {
        renderer: $.jqplot.BarRenderer,
        rendererOptions: {
            barPadding: 20,
            barWidth: 25,
            barMargin:10,
            fillToZero: true
        },
        pointLabels: { show: true }
    },
    series: [
        { label: 'USA' },
        { label: 'India' },
        { label: 'South Africa' }
    ],
    legend: {
        show: true,
        placement: 'outsideGrid',
        location:'se',
        background:'white',
        border: 'white',
        fontFamily: 'Gotham Medium',
        fontSize:'12px',
        renderer: $.jqplot.EnhancedLegendRenderer …