Skip to content

Multiline tick labels #6

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.

Sign up for GitHub

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

Merged
merged 2 commits into from
Oct 26, 2016
Merged

Multiline tick labels #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
57f97a7
minor variable cleanup
monfera Oct 26, 2016
ec9fa93
change for multiline text
monfera Oct 26, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 22 additions & 19 deletions lib/text.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,8 @@ proto.drawTicks = (function() {
var tickPad = plot.tickPad
var textColor = plot.tickColor
var textAngle = plot.tickAngle
var tickLength = plot.tickMarkLength
// todo check if this should be used (now unused)
// var tickLength = plot.tickMarkLength

var labelEnable = plot.labelEnable
var labelPad = plot.labelPad
Expand Down Expand Up @@ -125,7 +126,6 @@ proto.drawTitle = (function() {
var titleCenter = plot.titleCenter
var titleAngle = plot.titleAngle
var titleColor = plot.titleColor
var titleCenter = plot.titleCenter
var pixelRatio = plot.pixelRatio

if(!this.titleCount) {
Expand Down Expand Up @@ -199,29 +199,32 @@ proto.update = function(options) {
var vertices = []
var axesTicks = options.ticks
var bounds = options.bounds
var i, j, k, data, scale, dimension

for(var dimension=0; dimension<2; ++dimension) {
for(dimension=0; dimension<2; ++dimension) {
var offsets = [Math.floor(vertices.length/3)], tickX = [-Infinity]

//Copy vertices over to buffer
var ticks = axesTicks[dimension]
for(var i=0; i<ticks.length; ++i) {
for(i=0; i<ticks.length; ++i) {
var tick = ticks[i]
var x = tick.x
var text = tick.text
var font = tick.font || 'sans-serif'
var scale = (tick.fontSize || 12)

var data = getText(font, text).data
scale = (tick.fontSize || 12)

var coordScale = 1.0 / (bounds[dimension+2] - bounds[dimension])
var coordShift = bounds[dimension]

for(var j=0; j<data.length; j+=2) {
vertices.push(
data[j] *scale,
-data[j+1]*scale,
(x - coordShift) * coordScale)
var rows = text.split('\n')
for(var r = 0; r < rows.length; r++) {
data = getText(font, rows[r]).data
for (j = 0; j < data.length; j += 2) {
vertices.push(
data[j] * scale,
-data[j + 1] * scale - r * scale * 1.2,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

very nicely done.

(x - coordShift) * coordScale)
}
}

offsets.push(Math.floor(vertices.length/3))
Expand All @@ -233,12 +236,12 @@ proto.update = function(options) {
}

//Add labels
for(var dimension=0; dimension<2; ++dimension) {
for(dimension=0; dimension<2; ++dimension) {
this.labelOffset[dimension] = Math.floor(vertices.length/3)

var data = getText(options.labelFont[dimension], options.labels[dimension], { textAlign: 'center' }).data
var scale = options.labelSize[dimension]
for(var i=0; i<data.length; i+=2) {
data = getText(options.labelFont[dimension], options.labels[dimension], { textAlign: 'center' }).data
scale = options.labelSize[dimension]
for(i=0; i<data.length; i+=2) {
vertices.push(data[i]*scale, -data[i+1]*scale, 0)
}

Expand All @@ -248,9 +251,9 @@ proto.update = function(options) {

//Add title
this.titleOffset = Math.floor(vertices.length/3)
var data = getText(options.titleFont, options.title).data
var scale = options.titleSize
for(var i=0; i<data.length; i+=2) {
data = getText(options.titleFont, options.title).data
scale = options.titleSize
for(i=0; i<data.length; i+=2) {
vertices.push(data[i]*scale, -data[i+1]*scale, 0)
}
this.titleCount = Math.floor(vertices.length/3) - this.titleOffset
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "gl-plot2d",
"version": "1.1.9",
"version": "1.2.0",
"description": "2D webgl plots",
"main": "plot.js",
"directories": {
Expand Down