JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <td>
				<table class="tablecourbe" border=1 align=center>
					<tr>
						<td><label for="checkcsv">
							ddfsfdsf
						</label></td>
						<td><input type="checkbox" name="checkcsv" value="csv" id="checkcsv" /></td>
					</tr>
					<tr>
						<td><label>
			            gdfgfdd
							</label></td>
						<td><input type=text name=txtnamefile id=txtnamefile required value=dsfsfs /></td>
						
					</tr>					
				</table>
				</fieldset>
			<center><label id="demo" class=alarm ></label></center>
			</td>
			
			<td class=tdtableau >
				
				<div class="cursor" >
					<div class="cursor-h"></div>
					<div class="cursor-v"></div>
				</div>
				
				<div id="dd">		
					<svg id="svg1" style=position:static>
						<g id=g>
						</g>			
					</svg>	
				</div>
				
				<label id=lbl_Temp><?php echo trad($f_lng,"Temp");?></label>
				<label id=lbl_MinTemp>0</label>
					
				<label id=lbl_Ohm><?php echo trad($f_lng,"Ohm");?></label>
				<label id=lbl_MinOhm>0</label>
                
                <div id=div_textresolution></div>	
				<svg x=0 y=0 width=530px height=500px fill=black >
					

					//vertical
					<line title="Vertical" x1=60 y1=60 x2=60 y2=460 stroke-width=2 stroke=black /> 
					
					//horizontal
					<line title="Horizontal" x1=60 y1=460 x2=460 y2=460 stroke-width=2 stroke=black /> 

				</svg>
				
				<label id="lbl_souris"></label>
			</td>
		</tr>
		
		</table>

CSS

body,html,#dd,#svg1{
	padding:0;
	margin:0;
	width:98%;
	height:98%
}
				
#dd{
	position:absolute;
}

circle {cursor:move}

.cursor {
    position: absolute;
    width: 80%;
    height: 80%;
}


.cursor-h {
    position: relative;
	left: 60px;
    width: 400px;
    height: 0;
    border-top: 1px solid black;
}

.cursor-v {
    position: relative;
	top:60px;
    width: 0;
    height: 400px;
    border-left: 1px solid black;
}

.tablemain{
	width:100%;
}



.tdgraph{
	width:50%;
	
}

.tdtableau{
	width:50%;
	position:relative;
}

button:hover {
	background:#fffff;
}

#btn:hover
{
	background-color: LightCyan;
}

label#lbl_souris {
  position: absolute;
  background-color: Cyan;
}

#demo{
	 position: absolute;
	 left:140px;
}

label#lbl_Temp{
	position: absolute;
	left:35px;
	top:35px;
	
}

#lbl_MinTemp{
	position: absolute;
	left:40px;
	top:450px;
}

#lbl_Ohm{
	position: absolute;
	left:470px;
	top:455px;
}

#lbl_MinOhm{
	position: absolute;
	left:60px;
	top:475px;
}

#labeltemp{
	position: fixed;
}


#div_textresolution{
	margin: 0; 
	padding: 0;
	position: fixed;
}

JavaScript

var txtmaxresistance=100;
	var maxtemp=100;
	var resolutionOhm=10;
    var resolutionTemp=10;
    var txtmintemp=0;
    var txtminresistance=0;

	var svg = document.querySelector('svg');

	//array pour souver la derniere position pour dessiner les lignes
	var dernier_position_temp =new Array();
	var number_temp =new Array();
	//__________________________pour les lignes horizontal (y) °C ________________________
	for (var i = 1; i <= resolutionTemp; i++) {
		
		//400=longueur ligne horizontal (C) / resolution chousis
		var distance = 400/resolutionTemp;		
		
		var x1 = 50;
		var x2 = 70;
		
		//si c'est la premiere ligne
		if(i==1){
			y1= 460-distance;
			dernier_position_temp.push(y1);
			
		}else{
			//checher la dernier position - distance
			y1 = ((dernier_position_temp[i-2]-distance));
			dernier_position_temp.push(y1);
		
		}
		
		var y2 = y1;
		
		var line = document.createElementNS( 
			"http://www.w3.org/2000/svg", "line");
		line.setAttributeNS(null, "x1", x1);
		line.setAttributeNS(null, "y1", y1);
		line.setAttributeNS(null, "x2", x2);
		line.setAttributeNS(null, "y2", y2);
		line.setAttributeNS(null, "stroke", "black");
		line.setAttributeNS(null, "stroke-width", "2");
		svg.appendChild(line);
		
	
		var number=Math.round(((maxtemp-txtmintemp)/resolutionTemp)*i+txtmintemp);
	    alert(number);
		//push in array pour souver (pour fichier SVG)
		number_temp.push(number);
		
		//creation labels
		var labeltemp = document.createElement("Label");
		labeltemp.style.left = x2-45;
		labeltemp.style.top = y2-5;  
		labeltemp.style.position='absolute';
		
		var number = document.createTextNode(number);
		labeltemp.appendChild(number);
    
		//document.body.appendChild(labeltemp);
		document.getElementById("div_textresolution").appendChild(labeltemp);
	}
	
	var dernier_position_ohm =new Array();
	var number_ohm =new Array();
	//__________________________pour la ligne vertical (x) OHM _________________________
	for (var i = 1; i <= resolutionOhm; i++)...