我有一个带有SVG的网页.在某些形状上,我需要显示工具提示.但是,我无法将工具提示显示在它应该的位置,只是距离形状本身一些像素.
它出现在屏幕的右侧,可能距离大约300px.我用来获取坐标的代码如下:
d3.select("body")
.select("svg")
.select("g")
.selectAll("circle")
.on("mouseover", function(){return tooltip.style("visibility", "visible");})
.on("mousemove", function(){
var svgPos = $('svg').offset(),
/*** Tooltip ***/
//This should be the correct one, but is displaying at all working at all.
/*x = svgPos.left + d3.event.target.cx.animVal.value,
y = svgPos.top + d3.event.target.cy.animVal.value;*/
//This displays a tool tip but way much to the left of the screen.
x = svgPos.left + d3.event.target.cx.animVal.value,
y = svgPos.top + d3.event.target.cy.animVal.value;
Tooltip
window.alert("svgPos: "+svgPos+" top: "+y+"px left: "+x+"px "+d3.event.target.cx.animVal.value);
return tooltip.style("top", x+"px").style("left",y+"px");
})
.on("mouseout", …由于还不熟悉 Typescript，我正在尝试使用Typescript 在我的 React 应用程序中为我的 Recharts 图表创建自定义工具提示内容。@types/recharts已作为 a 之一安装devDependencies。
但是，当我定义CustomTooltip如下所示的函数时，Typescript 抛出错误
绑定元素“active”隐式具有“any”类型。TS7031
我们该如何解决这个问题呢？
const CustomTooltip = ({ active, payload, label }) => {
if (active) {
return (
<div className="custom-tooltip">
<p className="label">{`${label} : ${payload[0].value}`}</p>
<p className="desc">Anything you want can be displayed here.</p>
</div>
);
}
return null;
}
return (
<ComposedChart data={data}>
...
<Tooltip content={<CustomTooltip />} />
</ComposedChart>
)
尝试定义接口，但出现另一个错误
类型“{}”缺少类型“ICustomToolip”中的以下属性：活动、有效负载、标签 TS2739
interface ICustomToolip {
active: any;
payload: any;
label: any;
}
const …我正在使用Microsoft CodePlex项目中的WPF数据网格.我有一个自定义控件,我想从数据网格的行数据绑定到一个字段.我不能为我的生活弄清楚如何在datagrid行上指定工具提示.
我最接近的是使用带有Setter的RowStyle来设置工具提示,但这似乎只适用于文本.当我尝试将ControlTempalte作为ToolTip的值时,它会显示在ControlTemplate类型上调用ToString的结果.
我想我需要设置ToolTip的"Template"属性,但我似乎无法弄清楚如何做到这一点......
<dg:DataGrid Name="dgResults" AutoGenerateColumns="True">
<dg:DataGrid.RowStyle >
<Style TargetType="{x:Type dg:DataGridRow}">
<Setter Property="ToolTip" >
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToolTip}">
<StackPanel>
<TextBlock>txt1</TextBlock><TextBlock>txt2</TextBlock>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</dg:DataGrid.RowStyle>
</dg:DataGrid>
我使用.placeTaken类将divy工具提示添加到div.然后用户可以拖动框,因此我删除了类并将其添加到新的div中.当发生这种情况时,我向该div添加一个新的醉意工具提示,并且工作正常,但我想删除旧的.
他们说如果您希望通过将title属性设置为空字符串来删除工具提示,请改为设置original-title属性.我试过$("#"+dropFromId).attr("original-title", "");但工具提示仍在那里.我甚至无法通过设置另一个原始标题来更改工具提示标题.
我究竟做错了什么？
编辑:我想我没有给你们足够的信息.我使用ajax来获取从数据库中获取的位置.PHP返回一个关联数组(客户),然后我在我的JavaScript中使用,其中所发生的匹配名称.删除时所采取的位置会发生变化,因此我再次执行ajax函数以使用所有拍摄的位置更新数组.首先,我将醉意的工具提示添加到所有拍摄的地方,如此
$("#map div.placeTaken").tipsy({gravity: 'w', html: true, fade: true, title:
function(){
// id could for example be map74, substring to 74
var id = $(this).attr("id").substring(3,6);
return '<div>'+customers[id]+'</div><br />';
}
});
所以标题等于数组中匹配的位置.我希望我能够解释这个问题.当盒子掉到一个新的地方时,就会发生这种情况
$("#map div span").bind( "dragstop", function(event, ui) {
// some code here to change the .placeTaken class
// update database with the new place
$.ajax({
type: "POST",
url: "map.php",
data: "dropFromId="+ dropFromId.substring(3,6) +"& dropToId="+ dropToId.substring(3,6),
success: function(){
// ajax function to update the js array …我正在寻找一个轻量级的jquery插件,用于在用户将鼠标悬停在元素上时显示工具提示.我希望插件能够从title属性中获取内容,并且重要的是我可以创建新行.
任何帮助表示赞赏!
我想要做的是在鼠标结束后显示工具提示.鼠标输出后,工具提示不会关闭.
只有鼠标移出才能关闭工具提示.
客户有一个要求,他们希望ToolTip无限期地保持不变直到鼠标停止发生.
附加:有没有办法只关闭鼠标输出的工具提示,而不是鼠标移动？
鼠标将覆盖的区域是一个矩形,只有当我移出矩形时,工具尖端才会关闭.
谢谢.
我们的Windows窗体应用程序遇到问题,因为堆栈跟踪指示的类型为AccessViolationException的未处理异常发生在ToolTip控件中.
错误发生在应用程序的不同时间,我们目前无法可靠地重现它.在这个阶段,它仅在Windows 7的生产中发生,并且仅针对某些用户,而不是其他用户 - 即使在以类似方式使用该应用程序的用户中也是如此.它看起来与机器有关,所以我们做了一些事情,比如确保图形驱动程序是最新的.
在事件日志中,始终记录了2个不同的错误,其中一个与我们的应用程序有关:
Application: <Application>.exe
Framework Version: v4.0.30319
Description: The process was terminated due to an unhandled exception.
Exception Info: System.AccessViolationException
Stack:
at System.Windows.Forms.UnsafeNativeMethods.CallWindowProc(IntPtr, IntPtr, Int32, IntPtr, IntPtr)
at System.Windows.Forms.NativeWindow.DefWndProc(System.Windows.Forms.Message ByRef)
at System.Windows.Forms.ToolTip.WndProc(System.Windows.Forms.Message ByRef)
at System.Windows.Forms.ToolTip+ToolTipNativeWindow.WndProc(System.Windows.Forms.Message ByRef)
at System.Windows.Forms.NativeWindow.Callback(IntPtr, Int32, IntPtr, IntPtr)
at System.Windows.Forms.UnsafeNativeMethods.DispatchMessageW(MSG ByRef)
at System.Windows.Forms.Application+ComponentManager.System.Windows.Forms.UnsafeNativeMethods.IMsoComponentManager.FPushMessageLoop(IntPtr, Int32, Int32)
at System.Windows.Forms.Application+ThreadContext.RunMessageLoopInner(Int32, System.Windows.Forms.ApplicationContext)
at System.Windows.Forms.Application+ThreadContext.RunMessageLoop(Int32, System.Windows.Forms.ApplicationContext)
at <Company>.Windows.Forms.<Application>.Startup.Main(System.String[])
一个与comctl32.dll有关:
Faulting application name: <Application>.exe, version: 7.13.0.2086, time stamp: 0x4ec5e710
Faulting module name: comctl32.dll, version: 5.82.7601.17514, time stamp: 0x4ce7b82c
Exception …我没有看到这个确切的问题......如果有的话,请指出我.
我正在使用jquery的ui工具提示.我有一个链接,当你鼠标悬停它时,我想显示一个图像.到目前为止,对我来说没有任何作用.
标题中的ui代码:
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
HTML:
(see <a id='riverroad' href='#' title='' >image of 1 Maple St.</a>)
码:
$( "#riverroad" ).tooltip({ content: "<img src='./images/myimage.jpg/>" });
请告诉我我做错了什么.
我想使用jquery UI工具提示.
在工具提示中,我希望html中会有一个链接.
我看到这篇文章(Jquery UI工具提示不支持html内容),说明如何在工具提示中使用html.
但是当我想在工具提示中添加链接时会出现问题.
当我带光标进入工具提示点击链接时,工具提示消失了(因为我从分配给工具提示的元素中鼠标输出.
我能做什么？
谢谢.
更新:
$(function () {
$(document).tooltip({
content: function () {
return $(this).prop('title');
}
});
});
在AngularJS中,可以使用选择器在CSS中设置工具提示的样式 .md-tooltip
在Angular 4中使用自定义格式工具提示的方法是什么？
编辑:
我正在使用Angular 4和Material2.
我如何使用它的一个例子是:
<span mdTooltip='TEST' mdTooltipPosition='right'>TEST</span>
它显示工具提示非常好,除了我不知道如何设计它的事实.