SDK Version: v40 latest
Platforms(Android/iOS/web/all): : Android
Add the appropriate “Tag” based on what Expo library you have a question on.
Am trying to use expo-2d-context lib in my react native app :
GitHub - expo/expo-2d-context: A pure-js implementation of the W3C's Canvas-2D Context API that can be run on either Expo Graphics or WebGL
However am unable to draw image on canva using
drawImage
function nor i can get base64 data via
toDataURL
function
so any idea how to draw image and get base64 data from canva.
sample code
import { GLView } from 'expo-gl';
import Expo2DContext from 'expo-2d-context';
import React from 'react';
import {Image} from 'react-native';
export default class App extends React.Component {
render() {
return (
<GLView
style={{ flex: 1 }}
onContextCreate={this._onGLContextCreate}
_onGLContextCreate = (gl) => {
var ctx = new Expo2DContext(gl);
ctx.translate(50,200)
ctx.scale(4,4)
ctx.fillStyle = "grey";
ctx.fillRect(20, 40, 100, 100);
ctx.fillStyle = "white";
ctx.fillRect(30, 100, 20, 30);
ctx.fillRect(60, 100, 20, 30);
ctx.fillRect(90, 100, 20, 30);
ctx.beginPath();
ctx.arc(50,70,18,0,2*Math.PI);
ctx.arc(90,70,18,0,2*Math.PI);
ctx.fill();
ctx.fillStyle = "grey";
ctx.beginPath();
ctx.arc(50,70,8,0,2*Math.PI);
ctx.arc(90,70,8,0,2*Math.PI);
ctx.fill();
ctx.strokeStyle = "black";
ctx.beginPath();
ctx.moveTo(70,40);
ctx.lineTo(70,30);
ctx.arc(70,20,10,0.5*Math.PI,2.5*Math.PI);
ctx.stroke();
// draw image
var img = new Image();
img.onload = () => {
this.ctx.drawImage(img, 0, 0, width, height);
this.ctx.flush();
// get base64 image data
var b64 = gl.toDataURL();
img.src = "https://miro.medium.com/max/480/1*F6tkVg8eDXITOSA91Mh0kw.png";
thanks its useful i will give try snapshot of view is enough can be converted to base64 . .
do you have any idea how to draw image ? using this.ctx.drawImage(img, 0, 0, width, height);
its so sad they have not made any documentation for this lab , also all examples are of web side in html ![:frowning: :frowning:](https://emoji.discourse-cdn.com/apple/frowning.png?v=12)