Tag: jqplot
JqPlot作为图像
在最新的JqPlot示例中（参见此处 ，您可以单击某些图表下方的按钮，并将div向下滑动，图表为图像，允许您右键单击并另存为。 我检查了源代码，我无法看到自己发生了什么。 我已经看到了关于这个的各种讨论（请参阅此处，但是我的javascript是最基本的。但是我想在我当前的项目中实现这一点。 是否有人知道如何执行此操作的完整教程，即从实际的jquery代码到html代码中的实现。
在绘图上以编程方式设置标记
我想知道是否可以以编程方式突出显示标记上的标记。 我有一个折线图和一个单独的数据网格。 单击折线图中的标记将突出显示数据网格中的相关行，单击数据网格中的行将突出显示折线图中的相关标记。 在下面的例子中，我可以做第一个要求。 $(‘#chartdiv’).bind(‘jqplotDataClick’, function (ev, seriesIndex, pointIndex, data)返回我可以用来查找相关数据网格行的数据点。 但我坚持反过来。 在我的示例中，为简单起见，我已使用按钮替换了datagrid。 是否有SetSelectedMarker或我不知道的类似方法？ jqPlot examples ul.tooltip { list-style-type:none; padding:0px; margin:0px; } // We use a document ready jquery function. $(document).ready(function () { // Some simple loops to build up data arrays. var cosPoints = []; for (var i = 0; i < 2 * Math.PI; […]
jqPlot：如何用几种不同的颜色为背景/网格的部分着色
我正在使用优秀的jqPlot插件，我在文档中找不到的唯一function是“如何为几种不同颜色的背景/网格部分着色” 我的图表的x轴单位是日期。 如果可能的话，我想通过更改背景网格颜色来突出显示网格的周末部分（仅）。 或者任何人都有另一个想法？ 谢谢 编辑最终答案 根据Boro的建议，我开发了一种更好的方法来使用“line”选项而不是“verticalLine”选项来突出显示背景的一部分。 事实是，对于“verticalLine”，开发人员必须处理线宽。因此，很难获得您需要的东西，因为线的宽度从线的中心扩展而不是从边界扩散。 “线”选项允许设置起点和终点，以设置要突出显示的背景的确切部分。 width参数仍用于将行显示为列，但它是水平扩展而不是垂直扩展。 关于“lineWidth”属性，该值以像素定义。 因此，您可以使用图形容器高度设置值，并将“开始”和“结束”属性的“y”值设置为系列数据的平均值或y轴的大致中间范围。 我在这里更新了Boro的小提琴 grid: { drawGridLines: true, // wether to draw lines across the grid or not. gridLineColor: ‘#cccccc’, // Color of the grid lines. backgroundColor: “#eee”, borderColor: ‘#999999’, // CSS color spec for border around grid. borderWidth: 2.0, // pixel width of border around […]
自定义突出显示jqPlot堆积条形图
在jqPlot图表中添加自定义突出显示时，我只需使用 $(‘#chart’).bind(‘jqplotDataHighlight’, function (ev, sIndex, pIndex, data) { var chart_top = $(‘#chart’).offset().top, y = plot1.axes.yaxis.u2p(data[1]); // convert y axis units to pixels $(‘#tooltip’).css({ top: chart_top + y }); } 如最后一个例子所示。 这在我的简单条形图上非常有用。 然后我在堆积条形图上尝试相同的操作，并且x值关闭。 有谁知道我怎么能得到这些价值观或我做错了什么？
如何在jqplot饼图上显示工具提示
我有一个带有图例的jqplot饼图，我希望当鼠标hover在馅饼上时，传奇文本会显示为工具提示。 我不知道该怎么做。 有没有人有类似的经验？ 示例代码： $(document).ready(function(){ var data = [[‘Heavy Industry’, 12],[‘Retail’, 9], [‘Light Industry’, 14],[‘Out of home’, 16],[‘Commuting’, 7], [‘Orientation’, 9]]; var plot1 = jQuery.jqplot (‘chart1’, [data], { seriesDefaults: { renderer: jQuery.jqplot.PieRenderer, rendererOptions: { showDataLabels: true } }, legend: { show:true, location: ‘e’ } } ); });
带有动态ajax数据的JQPlot自动刷新图表
我想按时间间隔顺序更新jqPlot绘制的图表。 我的用例是这样的，AJAX调用只返回一个值。 例如： 1st AJAX call: 20 2nd AJAX call: 30 3rd AJAX call: 40 4th AJAX call: 32 所以我想把图形绘制成： First: only 20 Second: 20,30 Third: 20,30,40 Fourth: 20,30,40,32 我们可以在JQPlot中提取已绘制的数据，然后附加这个新数据集并重绘图形吗？ 任何人都可以帮忙吗？
jqPlotresize
告诉我是否有人遇到此问题： 我使用jqPlot在我的页面图上显示 $(document).ready(function () { $.jqplot.config.enablePlugins = true; var chLines = [[[’09/30/2010 00:00:00′,24.13],[’12/31/2010 00:00:00′,28.26],[’03/31/2011 00:00:00′,24.00],[’06/30/2011 00:00:00′,25.35],[’09/30/2011 00:00:00′,26.26],[’12/31/2011 00:00:00′,29.71]]]; var chSeries = [{ color: ‘#436277’, label: ‘label’ }]; var mnth; var quarter; $.jqplot.DateTickFormatter = function(format, val) { if (!format) { format = ‘%Y/%m/%d’; } if(format == ‘%Q’) { mnth = $.jsDate.strftime(val, ‘%#m’); quarter = parseInt((mnth-1) / […]
jqPlot DateAxis tickInterval不工作
我正在尝试每月绘制一个带有单个数据点的图表。 我在每个月的第一天将这个发送到jqPlot作为单点： $.jqplot(‘actualChart’, [[[‘2011-10-01’,0.296],[‘2011-11-01’,0.682]]], { title: programSelection.options[programSelection.selectedIndex].text, axes: { xaxis: { renderer: $.jqplot.DateAxisRenderer, rendererOptions: { tickRenderer: $.jqplot.CanvasAxisTickRenderer }, tickOptions: { formatString: ‘%b’ } } } } 我正在使用Ajax加载图表数据。 一些数据集比其他数据集具有更多的数据点 – 在上面的示例中仅有2个点，x轴刻度（’％b’表示仅显示为10月和11月）沿着轴自动渲染，但是经常，例如九月…十月…十月…十月…十月…十一月 – 沿着显示的线的常规点。 我只想在10月初和11月初的另一个打勾。 我花了很多时间搜索，似乎tickInterval是为此做的，但添加 tickInterval: ‘1 month’ 只是让x轴，数据点和线条消失 – 这就是我所指的破碎function！ 指定任何其他间隔，例如 tickInterval: ‘2 days’ 也打破了它。 解决方法是手动提供刻度，例如 ticks: [‘2011-10-01′,’2011-11-01’] 这确实把蜱放在了正确的位置，但是 a）是一个不应该被要求的麻烦，并且 b）在图形数据点的任何一端丢失漂亮的填充，因此两端的点出现在图形的边缘。 当然，除非添加任何一方的手动滴答，但在上面的10月至11月示例中，我不希望在任何一方提供整月，因为有趣的数据仅占用图的中间三分之一。 谁能帮我这个？ 提前致谢。 编辑 […]
