Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Expressions of Equality throws error #5947

Closed
andest01 opened this issue Jan 4, 2018 · 6 comments · Fixed by #5949
Closed

Expressions of Equality throws error #5947

andest01 opened this issue Jan 4, 2018 · 6 comments · Fixed by #5949
Assignees
Labels

Comments

@andest01
Copy link

andest01 commented Jan 4, 2018

mapbox-gl-js version:
Mapbox Version 0.43.0

Steps to Trigger Behavior

http://jsbin.com/tonekocohu/1/edit?html,output

Create a Mapbox Style with the following paint property:

// Minnesota = 27, BRRRRRR ITS COLD
const VERY_COLD_US_STATE_FIPS_CODE = '27' 

// a string property on your source's GeoJSON
const PROPERTY_NAME = 'fips' 

// lets make a style that will highlight Minnesota's border with a
// thicker border - so you know where it's cold!
const equalityExpression = ['==', ['get', PROPERTY_NAME], VERY_COLD_US_STATE_FIPS_CODE]
const widthExpression = ['case',
  equalityExpression, 2.5,
  0.5,
]

// apply our expression to the `line-width` property
// per the mapbox style spec

// this doesnt work :(
const paintProperty = {
    'line-width': widthExpression,
    'line-color': '#FFFFFF',
  },
}

Expected Behavior

The style for the applied geometry uses the expression correctly.

Actual Behavior

The mapbox engine crashes: Uncaught Error: can't serialize object of type function
screen shot 2018-01-04 at 11 22 06 am

== is undocumented, but clearly exists in the code base.
https://github.com/mapbox/mapbox-gl-js/blob/919be588592509f97eeb4a22510b56e7982dbcc6/src/style-spec/expression/definitions/equals.js
https://github.com/mapbox/mapbox-gl-js/blob/master/src/style-spec/expression/definitions/index.js#L37

The == operator did work in a prior mapbox version, specifically 0.42.0.

@andest01
Copy link
Author

andest01 commented Jan 4, 2018

There's a workaround: Use all with <= and >=.

const greaterThanCondition = ['>=', ['to-string', ['get', PROPERTY_ID]], expectedProperty]
const lessThanCondition = ['<=', ['to-string', ['get', PROPERTY_ID]], expectedProperty]
const unfortunateEquality = ['all', greaterThanCondition, lessThanCondition]
const widthExpression = ['case',
  unfortunateEquality, 2.5,
  0.5,
]

@andest01 andest01 changed the title Expressions of Equality throw error Expressions of Equality throws error Jan 4, 2018
@jfirebaugh
Copy link
Contributor

@andest01, thanks for the report. Could you please provide a self-contained example on jsbin.com or similar that shows the issue?

@andest01
Copy link
Author

andest01 commented Jan 4, 2018

@jfirebaugh
Copy link
Contributor

That seems to be generating some unrelated style validation errors.

@andest01
Copy link
Author

andest01 commented Jan 4, 2018

@jfirebaugh How frustrating - I inadvertently pasted an older version. My apologies.

I tested this version in a new tab and it's exhibiting the above behavior.
http://jsbin.com/tonekocohu/1/edit?html,output

screen shot 2018-01-04 at 12 35 39 pm

@jfirebaugh
Copy link
Contributor

jfirebaugh commented Jan 4, 2018

Thanks, I see the issue now! Should be an easy fix.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants