HighCharts : 사용자 정의 도면 용 툴팁

우리는 일부 생물 정보학 이미지를 그리는 응용 프로그램을 보유하고 있습니다. HighCharts.js는 아주 좋은 플로터입니다.HighCharts : 사용자 정의 도면 용 툴팁

tooltip: { 
    useHTML: true, 
    formatter: function() { 
     return 'here the html code'; 
    } 
},

그러나 맞춤 부품에 대한 툴팁을 추가하는 방법은 무엇입니까? 레이블에 대한 툴팁을 추가한다고 말하십시오.

출처

2013-07-07 Joy

사용자 정의 개체에 대한 하이 차트의 기본 툴팁을 사용할 수 없습니다. renderer.text, renderer.label 등 ... SVGObject을 반환하기 때문에.

해결 방법은 자신의 툴팁을 만드는 것입니다. 나는 당신이 트위터 부트 스트랩 같은 미리 정의 된 툴팁 라이브러리를 사용하는 것이 좋습니다 것입니다 : 당신은 우리가 class 속성에 사용자 정의 개체 덕분에 툴팁을 연결할 것을 볼 수 있습니다

// your tooltip created with bootstrap 
$(".yourlabel").tooltip({ 
// ^^^^^^^^^^ 
    'container': '#container', 
    'placement': 'top', 
    'title': 'Mytooltip' 
}); 

// with 
ren.label('Rasterized image', 100, 215) 
    .attr({ 
     'class': 'yourlabel' 
     //  ^^^^^^^^^ 
    }) 
    .css({ 
     color: colors[1], 
     fontSize: '10px' 
    }) 
    .add();

. 트위터 부트 스트랩 툴팁을 사용하려면 container 속성을 사용해야합니다. 그것은 여기에

라이브 예입니다 ... 그것없이 작동하지 않습니다 http://jsfiddle.net/rttav/

그리고이 트위터 부트 스트랩 툴팁에 대한 문서입니다 : http://twitter.github.io/bootstrap/javascript.html#tooltips

출처

2013-07-08 10:32:52

있습니다 사용자 지정 요소의 툴팁에 대한 기본 옵션이 없습니다 그러나 각 요소에 고유 한 툴팁을 추가 할 수 있습니다. 그냥 on() 기능 같은 것을 사용 :

ren.path(...).attr(...).add().on('mouseOver', function() { alert ('mouseOver!'); }).on('moueOut', function() { alert('mouseOut'); });

출처

2013-07-08 12:13:52

제목 필드가 툴팁 (JQuery와 - UI를 필요 없음)로 사용되는 것 같습니다 : 행동에

renderer.circle(200, 150, 100).attr({ 
    fill: '#FCFFC5', 
    stroke: 'black', 
    title:'Hello\nI am a \nmultiline tooltip', 
    'stroke-width': 1 
}).add();

: http://jsfiddle.net/Snarkturne/NYZNT/

출처

2013-07-18 17:16:45

HighCharts : 사용자 정의 도면 용 툴팁

답변

관련 문제