javascript-如何在浮点图文本数据中将x轴值设置为工具提示

2019-10-09 14:42:39 阅读：172 来源： 互联网

我尝试使用Flot char中的以下代码绘制图表.图表正在按预期绘制,但不是工具提示

$(function() {

        var data = [["Aug 06",2],["Aug 07",1],["Aug 08",1.5],["Aug 09",0],["Aug 10",0],["Aug 11",0],["Aug 12",0]];
    var options = {

      series: {
        lines: { show: true,
          lineWidth: 1,
          fill: true, fillColor: { colors: [ { opacity: 0.5 }, { opacity: 0.2 } ] }
        },
        points: { show: true, 
          lineWidth: 2 
        },
        shadowSize: 0
      },
      grid: { hoverable: true, 
        clickable: true, 
        tickColor: "#eeeeee",
        borderWidth: 0,
        hoverable : true,
        clickable : true
      },
      tooltip : true,
      tooltipOpts : {
        content : "Your sales for <b>%x</b> was <span>$%y</span>",
        defaultTheme : false
      },
      xaxis: {
            mode: "categories",
            tickLength: 0 
        },
        yaxis: {
                  min: 0
                } ,
      selection: {
        mode: "x"
      }
    };
        $.plot("#section-chart", [ data ], options);

        // Add the Flot version string to the footer

        $("#footer").prepend("Flot " + $.plot.version + " &ndash; ");
});

将鼠标悬停在值上时,工具提示将显示“您的％x销售额为$2”,而应显示“您8月6日的销售额为$2”.在这里,我应该如何将x轴值作为浮动提示中的工具提示传递？
我对此做错了.好心的建议？

解决方法:

解决问题的最简单方法是将内容字符串替换为回调：

tooltipOpts : {
        content : getTooltip,
        defaultTheme : false
      },

我定义了getTooltip以获取所需的输出：

function getTooltip(label, x, y) {
    return "Your sales for " + x + " was $" + y; 
}

正如您在updated jsFiddle中所见,它可以正常工作,但您可能需要在评论中考虑船长的建议,并查看最适合您的情况.

标签：javascript,jquery,flot
来源： https://codeday.me/bug/20191009/1879886.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript-如何在浮点图文本数据中将x轴值设置为工具提示