Search Posts

Category: fabricjs

Angular ng-model update the value in textbox in canvas

Canvas loaded from json with Added Text. I want to update the update text on entering the data in Textbox outside the canvas. Attached the fiddle. https://jsfiddle.net/sujathavts/km6vc8vs/6/ Any help <div ng-app ng-controller=”LoginController” > <div>Hello {{ user.firstName }}</div> <input ng-model=”user.firstName”> <div ng-repeat=”login in logins”>{{ login }}</div> <canvas id=”c” width=”500″ height=”500″></canvas> <br/> </div> Source: AngularJS

AngulaJS + FabricJS + ASP.MVC

I create project asp.mvc and add angularjs and add fabricjs https://codepen.io/michaeljcalkins/pen/Imupw Now i catch error in console: Error: [$injector:unpr] Unknown provider: FabricProvider <- Fabric <- ExampleCtrl My app.js: var app = angular.module(‘myApp’, [‘ngRoute’, ‘ngResource’]); angular.module(‘example’, [ ‘common.fabric’, ‘common.fabric.utilities’, ‘common.fabric.constants’ ]).controller(‘ExampleCtrl’, [‘$scope’, ‘Fabric’, ‘FabricConstants’, ‘Keypress’, function ($scope, Fabric, FabricConstants, Keypress) { $scope.fabric = {}; $scope.FabricConstants = FabricConstants; // // Creating Canvas Objects // ================================================================ $scope.addShape = function (path) { $scope.fabric.addShape(‘http://fabricjs.com/assets/15.svg’); }; $scope.addImage = function (image) { […]

How do I read a JSON file in Angular?

I am trying to load a JSON file from local disk and use the data from it to fill a FabricJS canvas. I have problems on getting the data from the file. This is what i have till now. app.html <input type=”file” accept=”.json” id=”fileInput” (change)=”loadFile($event)”/> app.ts loadFile(event) { const eventObj: MSInputMethodContext = <MSInputMethodContext> event; const target: HTMLInputElement = <HTMLInputElement> eventObj.target; const files: FileList = target.files; this.file = files[0]; const reader = new FileReader(); reader.readAsText(this.file, ‘utf8’); […]