изменение стиля шрифта ткани ткани после добавления

Question

Мое намерение - изменить шрифт, выбрав тип шрифта, как я собираюсь изменить шрифт сразу, выбрав его.

мой код изменение шрифта:

//the font wont change getAcriveObject 
    $(function() { 
     $('#FontStyleNumber').change(function(){ 
     var cFont = $(this).val(); 
     var tObj = canvas.getActiveObject(); 
     tObj.set({fontFamily : cFont}); 
     canvas.renderAll(); 
     }); 
    }); 

jsfiddle: mylink

Answer 1

Существует, потому что вы должны включать все скрипт внутри Jquery OnLoad:

Your fixed example

попробовать себя в ниже, если решение подходит для вас:

$(function() { 
 
    var canvas = new fabric.Canvas('textCanvas'); 
 

 
    var textObj1 = new fabric.Text('font test', { 
 
    left: 100, 
 
    top: 100, 
 
    fontSize: 30, 
 
    fill: "#FF0000" // Set text color to red 
 
    }); 
 

 
    canvas.add(textObj1); 
 
    $('#FontStyleNumber').change(function() { 
 
    
 
    var mFont = $(this).val(); 
 
    var tObj = canvas.getActiveObject(); 
 
    tObj.set({ 
 
     fontFamily: mFont 
 
    }); 
 
    canvas.renderAll(); 
 
    }); 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.5.0/fabric.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label>Select Font:</label> 
 
<select name="FontStyleNumber" id="FontStyleNumber"> 
 
    <option value="Times New Roman">Times New Roman</option> 
 
    <option value="Arial">Arial</option> 
 
    <option value="Georgia">Georgia</option> 
 
    <option value="Hammersmith One">Hammersmith One</option> 
 
    <option value="Pacifico">Pacifico</option> 
 
    <option value="Anton">Anton</option> 
 
    <option value="Sigmar One">Sigmar One</option> 
 
    <option value="Righteous">Righteous</option> 
 
</select> 
 
<div class="textcanvas_warpper"> 
 
    <canvas id="textCanvas" width="500" height="500" style="border: 1px solid black; margin-left:50px; margin-top:35px; z-index:1;"></canvas> 
 
</div>