fabricjs


Adding text over images in fabricjs


developing this app in which there several images on a canvas and i am using using fabricjs.
i want to add text overlaid on an image and then be able to remove it as well.
is a way to directly write over the image or do i have to create another layer and write onto it.
there is text related like
var text = new fabric.Text('hello world', { left: 100, top: 100 });
canvas.add(text);
the problem with the above approach is that if the image moves the text will not, so is it possible that the text could be written directly above the image?
any ideas of how this could be done? i revived several discussions where it's not as clear, how it could be done.
any pointers would be most appreciated.
I am not quite clear of what exactly is your requirement.
Regardless of it, i have created a jsfiddle for you. Please visit this.
https://jsfiddle.net/xpntggdo/9/
textBox=new fabric.Textbox("Enter Text",{
fontSize: 16,
fontFamily: 'Arial',
textAlign: 'left',
width: 180, // for 20 characters
top:arrowTop,
left:arrowLeft
});
canvas.add(textBox);
canvas.renderAll();
This might be of a little help at least. Comment on this answer and I will try to help you more on it if that is possible for me. Please upvote if you like it.

Related Links

Connect two elements with an arrow in Fabric.js
Coordinates system changed in Fabric.js 1.3.12?
lockScaling for Fabric.js objects
Fabric.js: front and back views
Dragging in Fabric.js
Using glfx.js filters in Fabric.js
Fabric.js loadFromJSON width/height properties deserialization
Fabric.js - text decoration looks not exactly right
Fabric.js flipX and flipY don't seem to work
originX and originY are not set to center by default in 1.3.9 [closed]
How to get polygon points in Fabric.js
Creating and selecting a group programmatically with Fabric.js
Load from JSON is not working with Patterns in the latest version of Fabric.js
Load from JSON in Fabric.js loading default properties
How to `lockscaleX` and `lockscaleY` but allow `uniscaling` the object in Fabric.js?
canvas.toDataURL to Wordpress Library

Categories

HOME
beautifulsoup
phantom-dsl
mysql-workbench
nuget
rom
zip
banner
frontend
pattern-matching
rtf
google-form
libusb
firefox-addon
symbols
user-experience
ksh
systemtime
exploit
comparator
siri
licensing
mql
gitlab-api
powershell-ise
glib
installshield-le
hunspell
pop3
python-import
reverse
pdw-file-browser
python-pptx
openerp-7
google-knowledge-graph
recurrent-neural-network
news
unordered-map
mcustomscrollbar
visa
bindingnavigator
drupal-theming
cnc
globalize
configurationmanager
vugen
lightning
aquamacs
java-bytecode-asm
excel-dna
trigger.io
model-associations
android-dateutils
lua-telegram-bot
php-socket
qbxml
linklabel
gocql
jdi
include-guards
zscript
ocra
graphics2d
ejb-2.x
dbaccess
boost-program-options
mdichild
angular-carousel
conditionaltagsupport
multitasking
xmltodict
visual-studio-express
windows-phone-8-sdk
unit-of-work
workitem
video-codecs
cascadingdropdown
virtual-pc
asplinkbutton
joomla3.1
wcf-configuration
subgraph
kqueue
isa-swizzling
flex-mobile
mysql-error-1205
google-ajax-api
drawtobitmap
massive
ruby-1.8
duplex
cfwindow
todos

Resources

Mobile Apps Dev
Database Users
javascript
java
csharp
php
android
MS Developer
developer works
python
ios
c
html
jquery
RDBMS discuss
Cloud Virtualization
Database Dev&Adm
javascript
java
csharp
php
python
android
jquery
ruby
ios
html
Mobile App
Mobile App
Mobile App