Get the canvas object while using fabric js

I'm using Fabric.js and I've created a fabric canvas object at one place.

var x = new fabric.Canvas("mycanvas");

Now at another place, I want to access this object where 'x' won't be available. So how can I get the same fabric canvas object.

I don't wanna change the scope of x or pass x as arg.

Also, how to get the toDataURL from the fabric canvas object?

-----------------If you don't make the reference available, it won't be able to be accessed. That's how scope works. – alex

18down voteaccepted

Assuming that mycanvas is the ID of a Canvas element, you could store the reference to the fabric object on the Canvas element itself:

var x = new fabric.Canvas("mycanvas");
document.getElementById("mycanvas").fabric = x;

You can then retrieve that object any time you want with:

var y = document.getElementById("mycanvas").fabric;
var url = y.toDataURL("png", 1);
answered Nov 2 '12 at 12:47
Alnitak

252k54316396
 

fabricJs使用系列(一)的更多相关文章

  1. Angular2入门系列教程7-HTTP(一)-使用Angular2自带的http进行网络请求

    上一篇:Angular2入门系列教程6-路由(二)-使用多层级路由并在在路由中传递复杂参数 感觉这篇不是很好写,因为涉及到网络请求,如果采用真实的网络请求,这个例子大家拿到手估计还要自己写一个web ...

  2. 【原】Android热更新开源项目Tinker源码解析系列之三:so热更新

    本系列将从以下三个方面对Tinker进行源码解析: Android热更新开源项目Tinker源码解析系列之一:Dex热更新 Android热更新开源项目Tinker源码解析系列之二:资源文件热更新 A ...

  3. Angular杂谈系列1-如何在Angular2中使用jQuery及其插件

    jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...

  4. ABP入门系列(1)——学习Abp框架之实操演练

    作为.Net工地搬砖长工一名,一直致力于挖坑(Bug)填坑(Debug),但技术却不见长进.也曾热情于新技术的学习,憧憬过成为技术大拿.从前端到后端,从bootstrap到javascript,从py ...

  5. 03.SQLServer性能优化之---存储优化系列

    汇总篇:http://www.cnblogs.com/dunitian/p/4822808.html#tsql 概  述:http://www.cnblogs.com/dunitian/p/60413 ...

  6. Angular2入门系列教程6-路由(二)-使用多层级路由并在在路由中传递复杂参数

    上一篇:Angular2入门系列教程5-路由(一)-使用简单的路由并在在路由中传递参数 之前介绍了简单的路由以及传参,这篇文章我们将要学习复杂一些的路由以及传递其他附加参数.一个好的路由系统可以使我们 ...

  7. Angular2入门系列教程5-路由(一)-使用简单的路由并在在路由中传递参数

    上一篇:Angular2入门系列教程-服务 上一篇文章我们将Angular2的数据服务分离出来,学习了Angular2的依赖注入,这篇文章我们将要学习Angualr2的路由 为了编写样式方便,我们这篇 ...

  8. Angular2入门系列教程4-服务

    上一篇文章 Angular2入门系列教程-多个组件,主从关系 在编程中,我们通常会将数据提供单独分离出来,以免在编写程序的过程中反复复制粘贴数据请求的代码 Angular2中提供了依赖注入的概念,使得 ...

  9. 【疯狂造轮子-iOS】JSON转Model系列之二

    [疯狂造轮子-iOS]JSON转Model系列之二 本文转载请注明出处 —— polobymulberry-博客园 1. 前言 上一篇<[疯狂造轮子-iOS]JSON转Model系列之一> ...

随机推荐

  1. nxlog安装配置

    Nxlog安装配置文档 任     帅 1.安装nxlog,全部默认即可. 如果拷贝直接安装,没有拷贝可以下载.下载链接: https://nxlog.co/system/files/products ...

  2. Java8特性详解 lambda表达式 Stream【转】

    本文转自http://www.cnblogs.com/aoeiuv/p/5911692.html 1.lambda表达式 Java8最值得学习的特性就是Lambda表达式和Stream API,如果有 ...

  3. 【http】http协议的队首阻塞

    1 队首阻塞 就是需要排队,队首的事情没有处理完的时候,后面的人都要等着. 2 http1.0的队首阻塞 对于同一个tcp连接,所有的http1.0请求放入队列中,只有前一个请求的响应收到了,然后才能 ...

  4. 【php】 检测 ie ie11 edge浏览器

    来源 php.net 官网评论截取 -- Declan kelly Please note that Internet Explorer 11 no longer contains MSIE in i ...

  5. struts 乱码

    在进行struts开发的过程中,总也是出现很多的乱码问题 ,但归根到底,也只是以下三种情况: ㈠页面显示中文乱码 ㈡传递参数中文乱码 ㈢国际化资源文件乱码 下面就这三中情况介绍怎么在具体项目中处理这些 ...

  6. http过程

    当在浏览器里输入URL地址时,http的通讯过程: 1) 连接 DNS解析:URL——>DNS服务器(找到返回其ip,否则继续将DNS解析请求传给上级DNS服务器) Socket连接:通过IP和 ...

  7. 网址导航[IT]

    一.Linux/UNIX Linux公社:http://www.linuxidc.com/index.htm Linux命令大全:http://man.linuxde.net 伯乐在线:http:// ...

  8. Mac下的Eclipse不能记住工作空间问题

    每次启动eclipse都要选择工作空间,即使你勾选了"选择这个作为默认"也不行. Eclipse版本 4.5, mac os版本10.12 找到这个目录下的config.ini文件 ...

  9. Java异常架构图及面试题---https://www.cnblogs.com/gaoweixiao99/p/4905860.html

    https://www.cnblogs.com/gaoweixiao99/p/4905860.html 红色为检查异常,就是eclipse要提示你是try catch 还是throws. 非检查异常, ...

  10. vmware安装CentOS " Intel VT-x 处于禁用状态"

    我刚用虚拟机vmware 11安装CentOS 7 ,出现错误“此主机支持 Intel VT-x,但 Intel VT-x 处于禁用状态”的问题,如下图. Intel VT-x 即Virtualiza ...