Comments (3)
Can you give me some code to reproduce?
width and height are defaulted to the image size parameters here and simple tests confirm this behaviour.
Maybe the problem lies somewhere else?
from g2.
This might rather be mec issue, not sure.
Try
{
"id":"img",
"nodes": [
{ "id":"origin","x":0,"y":0,"base":true }
],
"shapes": [
{ "type":"img","uri":"https://upload.wikimedia.org/wikipedia/commons/8/88/Microsoft_Tips_icon.png","p":"origin" }
]
}
Nothing will show.
I had to add b
and h
to mec2s mec.shape.img
and its g2 definition to make it work, see
{
"id":"img",
"nodes": [
{ "id":"origin","x":0,"y":0,"base":true }
],
"shapes": [
{ "type":"img","uri":"https://upload.wikimedia.org/wikipedia/commons/8/88/Microsoft_Tips_icon.png","p":"origin","b":150,"h":150 }
]
}
with changes
mec.shape.img = {
/**
* Check image shape properties for validity.
* @method
* @param {number} idx - index in shape array.
* @returns {boolean} false - if no error / warning was detected.
*/
validate(idx) {
if (this.uri === undefined)
return { mid:'E_IMG_URI_MISSING',id:this.id,idx};
if (this.p === undefined)
return { mid:'E_ELEM_REF_MISSING',elemtype:'image',id:this.id,idx,reftype:'node',name:'p'};
if (!this.model.nodeById(this.p))
return { mid:'E_ELEM_INVALID_REF',elemtype:'image',id:this.id,idx,reftype:'node',name:this.p};
else
this.p = this.model.nodeById(this.p);
if (this.wref && !this.model.constraintById(this.wref))
return { mid:'E_ELEM_INVALID_REF',elemtype:'image',id:this.id,idx,reftype:'constraint',name:this.wref};
else
this.wref = this.model.constraintById(this.wref);
return false;
},
/**
* Initialize polygon shape. Multiple initialization allowed.
* @method
* @param {object} model - model parent.
* @param {number} idx - index in shapes array.
*/
init(model,idx) {
this.model = model;
if (!this.model.notifyValid(this.validate(idx))) return;
this.w0 = this.w0 || 0;
this.b = this.b || 100;
this.h = this.h || 100;
this.xoff = this.xoff || 0;
this.yoff = this.yoff || 0;
this.scl = this.scl || 5;
},
dependsOn(elem) {
return this.p === elem || this.wref === elem;
},
asJSON() {
return '{ "type":"'+this.type+'","uri":"'+this.uri+'","p":"'+this.p.id+'"'
+ (this.wref ? ',"wref":"'+this.wref.id+'"' : '')
+ ((this.w0 && this.w0 > 0.0001) ? ',"w0":'+this.w0 : '')
+ ((this.b && Math.abs(this.b - 100) > 0.01) ? ',"b":'+this.b : '')
+ ((this.h && Math.abs(this.h - 100) > 0.01) ? ',"h":'+this.h : '')
+ ((this.xoff && Math.abs(this.xoff) > 0.0001) ? ',"xoff":'+this.xoff : '')
+ ((this.yoff && Math.abs(this.yoff) > 0.0001) ? ',"yoff":'+this.yoff : '')
+ ((this.scl && Math.abs(this.scl - 1) > 0.0001) ? ',"scl":'+this.scl : '')
+ ' }';
},
draw(g) {
const w0 = this.w0 || 0, w = this.wref ? ()=>this.wref.w + w0 : w0;
g.img({uri:this.uri,x:()=>this.p.x,y:()=>this.p.y,w,b:this.b,h:this.h,scl:this.scl,xoff:this.xoff,yoff:this.yoff})
}
}
from g2.
The problem is in cartesian
. img is bugged for undefined h
when cartesian
flag is set.
I'll hotfix that in a moment.
Thanks for pointing that out.
from g2.
Related Issues (20)
- mec documentation missing most symbols HOT 8
- pulley2 angle not working HOT 1
- g2.ext.md
- g2 chart HOT 1
- mec pulley() bug? HOT 1
- .exe() not chainable HOT 1
- tests for extensions are in old repositories HOT 1
- symbols documentation
- truss example missing bar labels ... HOT 1
- g2.editor.js should be removed ...
- Microsoft Edge not supported HOT 6
- State and Style example ... HOT 1
- 'format' property for 'ply' command
- remove usage of Map in g2.core
- 'scl' property of 'img' disappeared HOT 8
- 'ins' command should accept 'g2' objects
- chart-element samples missing HOT 2
- chart-element should reside in dist folder HOT 1
- xmin, xmax in chart do not work properly
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from g2.