특정 데이터가 입력되면 어린이가 차트를 표시 할 수있는 프런트 엔드를 개발 중입니다.
에서 바의 색상을 변경하고, 바의 색상을 변경하고 mouseover
,이 바와 관련된 데이터를 표시하고 싶습니다 . JQuery
만 사용하여 수행해야하며 플러그인을 사용할 수 없습니다.
<script id="hover">
function draw(){
var n = document.getElementById("num").value;
var GV = n.split(",");
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
var width = 40;
var X = 50;
ctx.fillStyle = "#003366";
for(var i = 0; i<GV.length; i++){
var h = GV[i];
ctx.fillRect(X,canvas.height - h, width, h);
X += width+15;
}
}
먼저 다이어그램이나 다른 코드를 <div>
요소에 추가하십시오 id
. 스크립트 태그에 주는 것은 좋지 않습니다.
id='hover'
div에 기부 한 후 아래 코드를 적용하고 확인하십시오! 이것이 효과가 있기를 바랍니다.
또한 .css()
요구 사항에 따라 개체 를 조작 하고 스타일을 추가 할 수 있습니다 .
$('#hover').mouseover(function() {
$(this).css({'font-size': '36px', 'color': 'red', 'background-color': 'blue'});
})
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다