Javascript Highcharts图例自定义HTML
我有一个highcharts图,我希望从用户那里收集关于每一条线的数据。我试图在图例中的每个标签旁边显示一个带有id或与序列名称相关的名称的文本输入框。然后我可以有一个按钮和代码将收集到的数据提交到其他地方的服务器 我尝试设置labelFormatter函数,但它似乎只支持纯文本 有没有一种简单的方法可以通过highcharts实现这一点,或者我正在考虑使用highchart事件挂钩编写自己的函数,它将进入并添加我想要的html 感谢您的帮助。Javascript Highcharts图例自定义HTML,javascript,highcharts,Javascript,Highcharts,我有一个highcharts图,我希望从用户那里收集关于每一条线的数据。我试图在图例中的每个标签旁边显示一个带有id或与序列名称相关的名称的文本输入框。然后我可以有一个按钮和代码将收集到的数据提交到其他地方的服务器 我尝试设置labelFormatter函数,但它似乎只支持纯文本 有没有一种简单的方法可以通过highcharts实现这一点,或者我正在考虑使用highchart事件挂钩编写自己的函数,它将进入并添加我想要的html 感谢您的帮助。 谢谢 所以我最终想出了一个“解决方案”。我不确定这
谢谢 所以我最终想出了一个“解决方案”。我不确定这是不是最好的,但我想在这里留张便条,以备其他人需要 我最终扩展了highstock源代码,并将其showCheckbox代码复制为showTextbox代码。这不是一个非常通用的解决方案,但它解决了我的特殊问题。我还必须修改onmousedown处理程序,以允许在单击文本框时将焦点传递给文本框 框以html格式呈现,位置精确,因此它们显示在图例项旁边。图例本身是图形SVG的一部分,因此很难在其中获取其他html 如果你想要所有的代码,请留下评论,我会发布它 看看这个例子。
您必须在loadedData中设置系列数据,然后只需在函数getItemsDescription中设置要显示的内容。如果希望在任何类型的标签/工具提示中使用html,则需要将useHTML设置为true(不在文档中:/)。它在POSISTING中给出了一些问题,但可以呈现任何html 范例
plotOptions : {
series: {
dataLabels: {
useHTML: true
}
}
}
您可以将Highcharts legend的
useHTML
选项设置为true
legend: {
useHTML: true,
labelFormatter: function () {
return '<span title="' + this.name + '">' + this.name + '</span>';
}
}
图例:{
是的,
labelFormatter:函数(){
返回“”+this.name+“”;
}
}
我登上这篇文章是为了搜索自定义工具提示。它有助于创建SVG元素。非常感谢+1为小提琴链接。嗨,汤姆,你能告诉我你是如何扩展高库存来源的吗。我确实需要更改图例渲染。