Enhancement: add a parameter to the importSvgString function in order… (#842)

* Enhancement: add a parameter to the importSvgString function in order to permit to decide if the importation should apply a transformation on the imported element or not

* allow user to import SVG preserving the dimension

Co-authored-by: JFH <20402845+jfhenon@users.noreply.github.com>
This commit is contained in:
cg-scorpio
2022-10-16 23:30:44 +02:00
committed by GitHub
parent cb2fe733dd
commit 8350b97875
2 changed files with 10 additions and 5 deletions

View File

@@ -617,6 +617,7 @@ const setSvgString = (xmlString, preventUndo) => {
* `<use>` to the current layer. * `<use>` to the current layer.
* @function module:svgcanvas.SvgCanvas#importSvgString * @function module:svgcanvas.SvgCanvas#importSvgString
* @param {string} xmlString - The SVG as XML text. * @param {string} xmlString - The SVG as XML text.
* @param {boolean} preserveDimension - A boolean to force to preserve initial dimension of the imported svg (force svgEdit don't apply a transformation on the imported svg)
* @fires module:svgcanvas.SvgCanvas#event:changed * @fires module:svgcanvas.SvgCanvas#event:changed
* @returns {null|Element} This function returns null if the import was unsuccessful, or the element otherwise. * @returns {null|Element} This function returns null if the import was unsuccessful, or the element otherwise.
* @todo * @todo
@@ -626,7 +627,7 @@ const setSvgString = (xmlString, preventUndo) => {
* arbitrary transform lists, but makes some assumptions about how the transform list * arbitrary transform lists, but makes some assumptions about how the transform list
* was obtained * was obtained
*/ */
const importSvgString = (xmlString) => { const importSvgString = (xmlString, preserveDimension) => {
const dataStorage = svgCanvas.getDataStorage() const dataStorage = svgCanvas.getDataStorage()
let j let j
let ts let ts
@@ -731,8 +732,10 @@ const importSvgString = (xmlString) => {
batchCmd.addSubCommand(new InsertElementCommand(useEl)) batchCmd.addSubCommand(new InsertElementCommand(useEl))
svgCanvas.clearSelection() svgCanvas.clearSelection()
useEl.setAttribute('transform', ts) if (!preserveDimension) {
recalculateDimensions(useEl) useEl.setAttribute('transform', ts)
recalculateDimensions(useEl)
}
dataStorage.put(useEl, 'symbol', symbol) dataStorage.put(useEl, 'symbol', symbol)
dataStorage.put(useEl, 'ref', symbol) dataStorage.put(useEl, 'ref', symbol)
svgCanvas.addToSelection([useEl]) svgCanvas.addToSelection([useEl])

View File

@@ -63,7 +63,8 @@ export default {
if (file.type.includes('svg')) { if (file.type.includes('svg')) {
reader = new FileReader() reader = new FileReader()
reader.onloadend = (ev) => { reader.onloadend = (ev) => {
const newElement = this.svgCanvas.importSvgString(ev.target.result, true) // imgImport.shiftKey (shift key pressed or not) will determine if import should preserve dimension)
const newElement = this.svgCanvas.importSvgString(ev.target.result, imgImport.shiftKey)
this.svgCanvas.alignSelectedElements('m', 'page') this.svgCanvas.alignSelectedElements('m', 'page')
this.svgCanvas.alignSelectedElements('c', 'page') this.svgCanvas.alignSelectedElements('c', 'page')
// highlight imported element, otherwise we get strange empty selectbox // highlight imported element, otherwise we get strange empty selectbox
@@ -263,7 +264,8 @@ export default {
$click($id('tool_open'), clickOpen.bind(this)) $click($id('tool_open'), clickOpen.bind(this))
$click($id('tool_save'), clickSave.bind(this, 'save')) $click($id('tool_save'), clickSave.bind(this, 'save'))
$click($id('tool_save_as'), clickSave.bind(this, 'saveas')) $click($id('tool_save_as'), clickSave.bind(this, 'saveas'))
$click($id('tool_import'), () => imgImport.click()) // tool_import pressed with shiftKey will not scale the SVG
$click($id('tool_import'), (ev) => { imgImport.shiftKey = ev.shiftKey; imgImport.click() })
} }
} }
} }