Features

• XYFrame and OrdinalFrame now accept arrays of accessors for oAccessor, rAccessor, xAccessor, yAccessor, lineDataAccessor, and areaDataAccessor. which allows you to create something like this:

From a single dataset with code like this:

<XYFrame
      areas={[{ coordinates: pointTestData }]}
      areaDataAccessor={[
        d => d.coordinates.filter(p => p.color === "#4d430c"),
        d => d.coordinates.filter(p => p.color === "#00a2ce")
      ]}
      areaType={{ type: "contour", thresholds: 5 }}
      xAccessor="x"
      yAccessor="y"
      areaStyle={d => {
        return {
          stroke: d.parentArea._baseData[0].color,
          fill: "none",
          strokeOpacity: 0.5,
          strokeWidth: 3,
          strokeDasharray: "15 5"
        }
      }}
    />

Notice the array in areaDataAccessor. This convenience could be improved by somehow decorating the data to know how it was made but for now that's not available. In the case of annotations, the annotation will be applied to the first valid accessor and not to all valid accessors.

Fixes

• sortO is finally back to normal
• Default stroke for radial annotations
• Fix a few examples that had grown screwy
• Add default stroke of black and fill of none for regular lines in XYFrame
• Extent when sent as a complex object to XYFrame wouldn't cause a rerender

Fixes

• OrdinalFrame sorting of columns was defaulting to the wrong order after introduction of more involved sorting options.

Fixes

• A custom sankey (like the original d3-sankey) sent to customSankey in networkType would fail if you didn't send any nodePadding
• ResponsiveFrame was sharing the isResizing var across instantiations

Features

• Upgrade to react-annotation 1.3.0
• events is passed to the underlying react annotation, if events is passed to <Annotation> then it will automatically have pointer-events turned on.

Fixes

• Basic lines in XYFrame are no longer drawn with two-sided areas. That means they need to have their fill set as you would a normal line and that they will not do an animated transition into a stacked chart. This was done to resolve a long-term Chrome rendering bug with SVG that couldn't handle single pixel-width perfectly straight areas. It also cured the poor honoring of stroke-dasharray since technically these lines were one on top of the other.
• sortO in OrdinalFrame is now passed the column details in new third and fourth parameters so you can set a function to sort based on column data like sortO={(columnAName,columnBName,columnAData,columnBData) => your sorting logic here}
• Joy plots can have an ordinal axis if you don't have enough axes in your life already. They're set with an axis property of the summaryType that obeys the same axis settings seen elsewhere in Semiotic.
• InteractionLayer should be properly redrawing overlays and interaction regions. It wouldn't update these regions with resizing and also had issues recognizing when NetworkFrame was sending point-based and area-based regions
• parentLine will now show up as an attribute of a calculated annotation in situations where that makes sense

Features

• ResponsiveFrames will by default debounce by 200ms (they'll wait until there has been no resizing in the last 200ms to fire a resize). You can change this by sending your frame a different debounce property
• sortGroups (for Chord diagrams) is honored as a passthrough on networkType

Fixes

• The way unique values in OrdinalFrame were being calculated ran into issues with the most common polyfilled version of IE11 making the charts not render in IE11
• null/undefined in your array of annotations (or functions returning such) sent to hoverAnnotation could trigger the default annotation instead of no annotation at all.
• Calculated extents in XYFrame (when sending a partial extent like yExtent={[0,undefined]} were having strange effects with Responsive frames.

Bugs

• This resolves the issue with the unpkg dist failing on the element-resize code.
• NetworkFrame wasn't properly resizing when the frame size changed

Hopefully this finally resolves a few persistent issues with yarn and npm related to dependencies that were pointed at repos (element-resize-event which I'd forked to add support for tabindex as well as Rough which I'd forked and built to ES5).

FIXES

• Accessible tooltips in ordinal summary types and node/edge weren't being passed the same data as was passed on mouse hover
• Custom node and edge marks were sometimes not being honored
• NetworkFrame iterations settings were not being honored

CHORES

• CircleCI status added to readme (thanks @rgbkrk)
• Vendorize element-resize-event and rough so that Semiotic points to NPM versions of each rather than direct to repos.

FIXES

• Ordinal overlays should complain about overlapping keys
• Stringify Ordinal keys when non-strings are passed (like dates)
• Resolve rollup download button this complaint (thanks @rgbkrk)

FEATURES

• NetworkFrame gets highlight annotation finally
  

CHORE

• Implement CI (Thanks @rgbkrk!)
• Implement Flow (Thanks, I think, @rgbkrk!)
• Clean up scripts (Thanks @rgbkrk!)
• Clean up rollup (Thanks @rgbkrk!)

FIXES

• NetworkFrame hover wasn't working for traditional network charts

CHORES

• Add flow for typing (thanks @rgbkrk!)
• Lots of build and script cleanup (thanks @rgbkrk!)
• Fix unit tests (thanks @puria!)

CHOREs

• Cleaned up the docs a bit. Will get them in better shape coming up
• Cleaned up transparency handling in canvas rendering
• Parallel Coordinates example uses canvas to show improved canvas performance (but the actual code doesn't reflect the change because it's manual instead of automatic, which I will fix)

FEATURES

• NetworkFrame now renders hover areas for area type nodes (circle pack, treemap and partition) and it's available in other modes if you send hoverAnnotation="area" in contrast to earlier when these network types used voronoi based on centroids. So the hover behavior should make a lot more sense. Are hover on edges is not currently supported.

FIXES

• More frame props properly listed
• OrdinalFrame connector styling sends the right data for canvas styling

FIXES

• Responsive props aren't sent to frames so no more errors about how that's happening
• ordinalAlign="center" wasn't honored for dynamic width radial bar charts
• marginalia wasn't handling multi-subject annotations well
• Update semiotic-mark version so it doesn't complain about tx,ty

FEATURES

• angleRange is a property of an OrdinalFrame type honored when in radial projection for bar, clusterbar and timeline and allowing you to define an angle range to draw the chart in. The range is an array so if you want to draw a pie chart from 30° to 330° you would set:

type={{ type: "bar", angleRange: [ 30,330 ] }}

If you want to loop around, you can pass values greater than 360°. The second value of angleRange always needs to be higher than the first, so if you wanted to flip the prior example you would use:

type={{ type: "bar", angleRange: [ 210,510 ] }}

• offsetAngle is a property of an OrdinalFrame type honored when in radial projection for bar, clusterbar and timeline and allowing you to define where to start drawing the pie chart (by default it's drawn from 0°). Expected value is an integer in degrees of offset.

Fixes

• Tooltips generated by keyboard navigation for accessibility will disappear when you change focus away from a frame
• Update typos in docs (mainly customDoubleClickBehavior)
• Document so many missing prop types (thanks @micahstubbs!)
• beforeElements and afterElements work properly across all frames now

Cleanup

• Moved prop-types into their own file so that they could share prop types and just generally clean them up

Features

• Frames will now warn you if you pass a prop that the frame doesn't take and will also tell you if you pass the prop from a different frame

Features

• NetworkFrame can take a graph prop that is an object with edges and nodes or a hierarchical data structure (like you use with d3-hierarchy)
• Less data processing when you only pass changes to non-data properties (only in XYFrame for now) so if you change style or axis properties it doesn't recalculate the data space. This will improve and be rolled out to other frames once I figure out the best approach.
• frame-hover now accepts a color prop that you can use to set the color of the hover circle. By default you send an undecorated frame-hover when hoverAnnotation={true} but you can use the built in custom hover behavior to pass a specific color or a dynamic color like so:

hoverAnnotation={[ { type: "frame-hover", color: "orange" } ]}
hoverAnnotation={[ d => ({ type: "frame-hover", color: d.parentLine && d.parentLine.color || "none" }) ]}

• The hexbin and grid area types now accept a customMark function that is sent the parameters of the hex or cell and can be used to draw custom shapes. Examples added at the end of the XY Plots Tutorial.

Fixes

• Fix git repo addresses in the dependencies so they work with yarn thanks to @cvkline
• semiotic-mark update to fix wonky animations and git repo addresses that work with yarn thanks to @cvkline

Chores

• Thanks @micahstubbs for cleaning up a whole bunch of the build bits and just making everything better as far as linting and dependencies goes.
• Direct import of react-annotation dependencies for better bundle size thanks to @susielu

Features

• Grid will handle a custom scale (like scaleLog or scalePow)
• NetworkFrame will take a flipped direction in networkType for making bottom-up trees

Fixes

• Somehow a console log sneaked into the last release

Features

• heatmap and hexbin are now available options for areaType in XYFrame. A full explanation on their use as well as scatterplots and contour plots are available in new docs: https://emeeks.github.io/semiotic/#/semiotic/creatingxyplots

FIXES

• Marginalia annotations should properly redraw on responsive resizing
• custom click, hover and doubleclick events should be working across all frames

FIXES

• Points were not being decorated with their parentLine for pointStyle in XYFrame.
• package.json no longer points to exact versions in order to hopefully resolve the oddness around brush that happened when different versions of D3 libs were floating around.

FIXES

• 1.9.4 did not have the correct rollup settings and it broke all the codepens pointing at semiotic.min.js

Features

• Under the hood, roughjs is now used to render sketchy elements. To support this, any renderMode props will also take an object (or function returning an object) that can have the structure of {renderMode: "sketchy", roughness: 1.5, ...otherRoughJSOptions } to allow you to key different sketchy rendering settings based on data properties.
• Because of roughjs support for canvas, all elements that could be rendered in canvas (everything but summary elements in OrdinalFrame) will also be rendered sketchy in canvas now.

• lineType in XYFrame now lets you pass an object to interpolator that can have a property dynamicInterpolator that can take a function and will be passed each line data so you can interpolate lines with different interpolators in the same frame:

           lineType={{
              type: "line",
              interpolator: {
                dynamicInterpolator: (d, i) =>
                  i === 0 ? curveStep : curveBasis
              }
            }}

FIXES

• Bars in OrdinalFrame now have a minimum width of 1px even when padding or dynamicColumnWidth would push them into the negative.