Chess-dataviz – 专为D3.js编写的棋牌可视化库
来自: http://ebemunk.github.io/chess-dataviz/
Methods
constructor(selector, [ options ], [ data ])
argument | description | ||
---|---|---|---|
selector | DOM selector that you would pass to d3.select() | ||
options | options configuration object
the accessor keys for piece and color. this will define what parts of the data is being shown on the heatmap. valid values: piece: all, k, q, r, b, k, pcolor: w, b data | data formatted as: | The data consists of an array of 64 elements (only 2 shown in the example above) representing the squares, from top-left to bottom-right in row order ( a8, b8, c8 ... ,f1, g1, h1 ) data(data)Set or change the data of the graph. This method will automatically call update() . The data format needs to be the same as the one that the constructor accepts. options(options)Change graph options. This method will automatically call update() . You can change all the options as described in constructor except width and margin . update()Updates and re-draws the graph. You shouldn't need to call this under normal circumstances. PropertiescontainerHolds the reference to the DOM object containing the <svg> element. Same object as if you had called d3.select(selector) . dataContainerHolds the reference to the <g> element containing the data elements dispatchd3 event dispatcher. You can hook your event handler to this property to listen to graph events. EventsThe events are dispatched via this.dispatch . mouseenterWill fire when mouse enters a heat square. The handler will be passed the current data (count) for the square. mousemoveWill fire when mouse moves around a heat square. mouseleaveWill fire when mouse leaves a heat square. CSSThe CSS classes for styleable elements of the heatmap. |