mycurelabs / Vue Html2canvas
Licence: mit
Vue mixin for Html2Canvas
Stars: ✭ 90
Programming Languages
javascript
184084 projects - #8 most used programming language
Labels
Projects that are alternatives of or similar to Vue Html2canvas
Selene
A blazing-fast modern Lua linter written in Rust
Stars: ✭ 88 (-2.22%)
Mutual labels: hacktoberfest
Github Contributions
A tool that generates a repository which being pushed into your GitHub account creates a nice contributions calendar.
Stars: ✭ 1,295 (+1338.89%)
Mutual labels: hacktoberfest
Pytest Regressions
Pytest plugin for regression testing: https://pytest-regressions.readthedocs.io
Stars: ✭ 89 (-1.11%)
Mutual labels: hacktoberfest
Underworld2
underworld2: A parallel, particle-in-cell, finite element code for Geodynamics.
Stars: ✭ 89 (-1.11%)
Mutual labels: hacktoberfest
Surf N Perf
Micro-library for gathering web page performance data
Stars: ✭ 89 (-1.11%)
Mutual labels: hacktoberfest
Mopidy Party
Mopidy web extension designed for party
Stars: ✭ 89 (-1.11%)
Mutual labels: hacktoberfest
Silverstripe Gridfieldextensions
A collection of useful grid field components.
Stars: ✭ 89 (-1.11%)
Mutual labels: hacktoberfest
Nextcloud Vue
🍱 Vue.js components for Nextcloud app development ✌
Stars: ✭ 89 (-1.11%)
Mutual labels: hacktoberfest
Nimpylib
Some python standard library functions ported to Nim
Stars: ✭ 88 (-2.22%)
Mutual labels: hacktoberfest
Silverstripe Fluent
Multi-language translate module for Silverstripe, without having to manage separate site trees.
Stars: ✭ 89 (-1.11%)
Mutual labels: hacktoberfest
Laravel Package Maker
Get a 📦 skeleton and all other `make` commands from laravel base for package development.
Stars: ✭ 89 (-1.11%)
Mutual labels: hacktoberfest
Plyr React
A simple, accessible and customisable react media player for Video, Audio, YouTube and Vimeo
Stars: ✭ 89 (-1.11%)
Mutual labels: hacktoberfest
Rymfony
A work-in-progress CLI tool built in Rust to mimic the Symfony CLI binary
Stars: ✭ 89 (-1.11%)
Mutual labels: hacktoberfest
Vuex Map Fields
Enable two-way data binding for form fields saved in a Vuex store
Stars: ✭ 1,294 (+1337.78%)
Mutual labels: hacktoberfest
Hacktoberfest
Find more projects at https://hacktoberfest.digitalocean.com/#projects
Stars: ✭ 90 (+0%)
Mutual labels: hacktoberfest
Maskable
Create and preview maskable icons in the browser!
Stars: ✭ 90 (+0%)
Mutual labels: hacktoberfest
Sample Plugin
Example plugin, generated using `wp scaffold plugin sample-plugin`
Stars: ✭ 89 (-1.11%)
Mutual labels: hacktoberfest
Vue Html2Canvas
Vue mixin for Html2Canvas
Install
npm install vue-html2canvas
Or
yarn add vue-html2canvas
Usage
main.js
import Vue from 'vue';
import VueHtml2Canvas from 'vue-html2canvas';
Vue.use(VueHtml2Canvas);
component
<template>
<div>
<!-- SOURCE -->
<div ref="printMe" style="padding: 10px; background: #f5da55">
<h1 style="color: #000; ">Print me!</h1>
</div>
<!-- OUTPUT -->
<img :src="output">
</div>
</template>
<script>
export default {
data() {
return {
output: null
}
},
methods: {
async print() {
const el = this.$refs.printMe;
// add option type to get the image version
// if not provided the promise will return
// the canvas.
const options = {
type: 'dataURL'
}
this.output = await this.$html2canvas(el, options);
}
},
mounted() {
this.print()
}
}
</script>
Made with ❤️ by Jofferson Ramirez Tiquez
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].